Achievement Goals
- HTML에서 Javascript 파일을 불러올 때 주의점에 대해서 이해할 수 있다.
<script>태그가 적용되는 위치에 따라서 실행 결과가 달라질 수 있음을 이해할 수 있다.
1. HTML에서 JS스크립트를 적용할 때 <script>태그를 이용한다.
-아래 경우는html파일과 js파일이 같은 디렉토리에 있는 경우이다.
<script src="myScriptFile.js"></script>2. 기본적으로 <script> 태그를 만나면,
브라우저는 HTML 태그를 해석하는 것을 잠시 멈추고, JavaScript 파일을 불러와서 실행한다.
결론은,<script> 태그 등장과 동시에 스크립트가 실행된다는 것이다.
3. html에 <script> 사용하는 방법 <head>태그안에 넣는다.
4. html에 <script> 사용하는 방법 <body>태그 맨 끝에 넣는다.
5. 두가지 방식의 공통점
- 두 방식 모두 js파일과 연결된다.
6. 두가지 방식의 차이점 -
DOM을 사용시에는 html에 <script> 을<body>태그 맨 끝에 넣어서 사용해야 DOM을 사용할 수 있다.
- 먼저, js에다가 아래 내용을 넣자
console.log('welcome javascript')
let msgElement = document.querySelector('#msg');
console.log(msgElement);6-1. <head>에 <script>를 넣은경우
- 콘솔창에 아래 내용 출력
welcome javascript
null
6-2. <body>에 <script>를 넣은경우
- 콘솔창에 아래 내용 출력
welcome javascript
<div class="tweet" id="msg">hello</div>
javascript 공부하는 sumiindaeyo