HTML에 Javascript 적용하기(9-18)
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>
Author And Source
이 문제에 관하여(HTML에 Javascript 적용하기(9-18)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@blackwidow/유효성-검사9-18저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)