자바스크립트의 실행 순서
인터프리터 방식이므로 위에서 아래로 실행
* JavaScript 파일 및 문장을 <head> ~ </head> 사이에 넣엇을 경우
html 문서의 시작 -> <head> 에 있는 <script> 를 다운로드/실행 ->body에 있는 HTML 태그를 실행 -> 끝
-외부 script 파일을 사용할 경우 script 파일 다운로드가 늦을 때 HTML 실행되지 않은 상태에서 빈 화면이 보일 수 있음
*JavaScript 파일 및 문장을 <body> 끝에 넣을 경우
html 문서의 시작 -> <body>에 있는 HTML 태그를 실행 -> <script>를 다운로드/실행 ->끝
-완벽하지 않은 HMTL이 먼저 보여 잘못된 UI가 보일 수 있음
*<script async>를 사용할 경우
html 문서의 시작 -> script 파일을 동시에 다운로드/실행 -> <body> 에 있는 HRTL 태그를 실행 -> 끝
-script 파일이 여러개 있을 경우 먼저 다운로드된 script 파일을 먼저
실행하게 됨
-scrip 파일이 서로 연관성이 있는 경우 하나의 스크립트만 실행 후 문제가 발생할 수 있음
*<script defer > 를 사용하는 경우
html 문서의 시작 -> script 파일을 다운로드/실행 -> <body>에 있는 HTML태그를 실행 -> 끝
- HTML 시작되고 script 파일을 동시에 다운로드/실행을 진행함
- script 실행은 페이지 구성이 모두 끝날 때까지 지연
- script 순서에 따라 실행
'코딩공부 > HTML,CSS,JavaScript' 카테고리의 다른 글
| JavaScript_상수 (0) | 2023.04.04 |
|---|---|
| JavaScript_변수 (0) | 2023.04.04 |
| CSS_우선순위 (0) | 2023.04.03 |
| CSS_animation (0) | 2023.04.03 |
| CSS_transition (0) | 2023.04.03 |
