대부분의 프로그래밍 언어는 운영체제 위에서 작동하지만 자바스크립트는 브라우저 위에서 동작한다.
브라우저의 주요 기능은 사용자가 원하는 웹 페이지를 요청Request하면 서버로부터 응답Response을 받아 브라우저에 표시하는 것이다. 사용자가 URL주소를 통해 특정 웹 페이지를 요청하면 서버는 HTML, CSS, Javascript, 이미지 파일 등을 보냄으로써 응답한다.
브라우저 렌더링 엔진의 HTML 파서와 CSS 파서는 HTML파일과 CSS 파일을 파싱parsing하여 DOM(Document Object Model) 트리와 CSSOM(CSS Object Model) 트리를 생성하고 그것을 토대로 브라우저에 HTMl 요소들을 표시한다.
HTML 파서는 HTML파일을 읽어 내려가던 중 <script> 태그를 발견하면 DOM 생성 프로세스를 잠시 중단하고 브라우저의 자바스크립트 엔진에게 권한을 넘긴다. 권한을 받은 자바스크립트 엔진은 자바스크립트 코드를 실행시키고, 실행이 완료되면 다시 HTML 파서에게 제어 권한을 넘겨 아까 중단했던 지점부터 다시 DOM 생성을 재개한다.
이러한 브라우저 작동 방식으로 인해 <script>태그를 <body>태그의 맨 마지막에 넣는 것이다. 만약 <script>태그를 <body>태그의 중간에 삽입할 경우 렌더링 엔진에 의해 생성되던 HTML 요소의 생성이 중단되고, 자바스크립트 코드를 실행시키느라 페이지의 로딩 시간이 길어질 것이고, 자바스크립트 코드에서 아직 생성되지 않은 DOM 개체에 접근할 경우 에러가 발생할 수 있다.
