● script 태그 사용 위치
script 태그는 항상 body 태그의 종료 태그 바로 전에 사용합니다. 이는 내부 스크립트와 외부 스크립트 방법 모두 동일합니다.
<body>
<!-- 외부 스크립트 -->
<script src="script.js"></script>
<!-- 내부 스크립트 -->
<script></script>
</body>
body 요소의 종료 태그 전에 script 태그를 작성하는 이유는 style 태그에서와 같습니다. 웹 브라우저는 HTML 문서를 첫 번째 줄부터 순차적으로 해석합니다. 사용자에게 당장 보여 줘야 하는 영역은 HTML과 CSS가 가장 관련도가 큽니다. 만약 head 태그 안에 script 태그를 사용했는데 파일을 해석하는 데 10초가 걸리면 어떻게 될까요? 웹 브라우저는 10초 동안 다음 줄을 해석하지 못하고 대기합니다. 그러면 웹 브라우저에 내용이 표시되는 전체 시간도 길어집니다.
자바스크립트는 화면에 표시되는 웹 구성 요소에 동적 효과를 부여하는 데 더 큰 목적이 있어서 웹 브라우저에 구성 요소를 처음 표시할 때 당장 실행할 필요가 없습니다. 그러므로 HTML과 CSS 해석이 끝나는 시점인 body 요소의 종료 태그 전에 script 태그를 사용하는 것이 적절합니다.
수코딩의 조언
두 방법 중 실무에서는 주로 외부 스크립트 방법을 사용합니다. 여러 이유가 있지만, 가장 큰 이유는 유지 보수가 편하기 때문입니다. 따라서 학습 목적으로 작성하는 경우가 아니라면 항상 외부 스크립트 방법으로 작성해야 한다고 보면 됩니다.