<… < /script>
<body>...</body> 태그 안에 코드가 포함된 <script>...</script> 태그를 넣습니다. 실제로 이 작업을 수행할 수 있을 뿐만 아니라 HTML에서 JavaScript를 사용하는 두 가지 다른 방법이 있습니다. 헤드의 JavaScript
코드를 포함하는 <script> 태그를 <body>...</body> <head>...</head> 태그 예:
<html>
<head>
<h1> JavaScript in head. </h1>
<script>
alert("hello word!");
</script>
</head>
<body></body>
</html> 이 프로그램의 실행 결과는 이전 프로그램과 다르지 않지만 실제로는 JavaScript 코드가 < ;head></head> ; 에 넣는 것과 <body></body>에 넣는 것에는 차이가 있습니다.
간단히 말하면 <head></head> <body>에 넣는 것보다 먼저 실행하는 것이 좋습니다. head 태그의 코드는 페이지 그리기가 시작되기 전에 구문 분석되는 반면, 본문의 코드는 페이지가 렌더링되는 동안 이 코드를 읽을 때 실행됩니다.
외부 JavaScript
HTML에서 JavaScript 코드를 직접 작성하는 것 외에도 js 파일에 JavaScript 코드를 작성할 수도 있습니다. 이를 js라고 부릅니다. HTML로 된 파일. "hello world"를 예로 들어보겠습니다.
실험실 환경에서 다음 코드를 저장하고 이름을 "out.js"로 지정한 후 바탕화면에 놓습니다. alert("hello word!");
다음 코드를 저장하고 이름을 "test2.html"로 지정하고 데스크탑에 놓습니다.
<html>
<head>
<h1> my JavaScript code in "out.js" </h1>
</head>
<body>
<script src="out.js"></script>
</body>
</html>
마찬가지로 데스크탑에서 "test2.html" 파일을 더블클릭하고 브라우저를 호출합니다. 실행하면 실행 효과가 이전 두 절차와 다르지 않다는 것을 알 수 있습니다.
사실 처음 두 가지 방법은 페이지가 로드될 때 JavaScript 코드를 HTML에 직접 배치합니다. JavaScript 코드를 외부 파일에 배치하면 이벤트가 트리거되고 JavaScript 코드가 필요할 때만 호출되어 실행됩니다.
이렇게 하면 장점이 있습니다. 페이지가 비교적 복잡한 경우, 외부 파일에 많은 양의 JavaScript 코드를 넣고 필요할 때만 실행하면 페이지 로딩 속도가 크게 빨라집니다.
HTML 파일의 다른 위치에 다른 JavaScript 코드를 추가하고, 다른 위치에서 JavaScript 코드의 실행 순서를 실행하고 관찰합니다.
다음 내용을 참고하여 팝업창 순서를 지켜주세요.
으르르르
다음 섹션