-
HTML 에서 JavaScript 불러오기자바스크립트 2021. 10. 3. 00:28
HTML 에서 JavaScript 불러오기
<script src="out.js">alert('in html1');</script>- 외부 js 파일을 부르고 내부에 있는 script 를 실행시키면
- 외부 js 파일만 실행된다. (내부에 있는 script 는 실행되지 않음)
<script>alert('in html2');</script>- 내부에 있는 script 만 실행시키면
- 내부에 있는 script 가 정상적으로 실행된다.
<script src="-_-.js">alert('in html3');</script>- 존재하지 않는 외부 js 파일을 부르고 내부에 있는 js 를 실행시키면
- 외부 js 파일만 실행된다.
- 그러나 외부 js 파일이 존재하지 않으므로 아무 것도 실행되지 않는다.
<!DOCTYPE HTML> <html> <body> <!-- 외부 js 파일을 불러오고 내부에 있는 js 를 실행 --> <script src="out.js">alert('in html1');</script> <!-- 내부에 있는 js만 실행 --> <script>alert('in html2');</script> <!-- 존재하지 않는 외부 js 파일을 불러오고 내부에 있는 js 를 실행 --> <script src="-_-.js">alert('in html3');</script> </body> </html>그렇다면 HTML 에서 어떤 방법으로 JavaScript 를 불러와야 하는가?
- HTML 안에 직접 Script 작성
- 아주 간단한 Script 일 때만 사용
- 외부에서 js 파일 불러오기
- Script 가 길어질 때 사용
- 성능적으로 더 좋음
외부 js 파일을 어떻게 불러오는가 ?
- 브라우저가 Script 파일을 받아 Cache 에 저장
- HTML1.html 에서 Script 를 불러옴
- Cache 에 저장된 hogumachu.js 파일을 불러옴
- HTML2.html 에서 Script 를 불러옴
- Cache 에 저장된 hogumachu.js 파일을 불러옴
∴ 브라우저가 Script 를 새로 다운 받지 않고 Cache 에 저장된 Script 를 바로 불러와서 성능이 좋음 (트래픽 절약, 속도 증가)
레퍼런스
'자바스크립트' 카테고리의 다른 글
[프로그래머스] 게임 맵 최단거리 Javascript (0) 2021.10.06 var, let, const 차이점 (블록 스코프, 함수 스코프) (0) 2021.10.04 Boolean 형 변환 (0) 2021.10.03 - 외부 js 파일을 부르고 내부에 있는 script 를 실행시키면