처음 html css를 배울 때 <script>테그를 일반적으로 body가 끝나는 곳에 위치하라고 배울테지만 이렇게 했을 경우 문제가 생길 때가 있다.
html, css를 javascript로 조작해서 스타일을 만드는 경우는 <script>테그를 body가 시작하기 전 head에 위치를 시켜야 한다.
안그렇고 일반적으로 하던대로 body뒤에 위치하는 경우 document가 이미 html css로 화면을 그린 이후이기 때문에 스타일을 조작하는 javascript가 실행되어 보이지 않을 경우가 있었다.
그 외의 동작과 데이터의 처리를 담당하는 javascript의 파일은 body 뒤쪽에 위치를 시킨다.
보통 js파일들은 무거워서 읽는데에 시간이 오래 걸리는데 이렇게 하지 않을 경우 document를 js부터 읽느라 빈 화면이 오래 떠 있는 문제가 생길 수 있다. 그 뿐만 아니라 jquery selector나 document.getElementbyId혹은 document.getElementbyClass이런식으로 html테그들을 불러와서 조작하는 경우 document내에서 javascript를 먼저 부르면 html테그가 형성되지 않아 이 아이들을 잡지 못한다.
단순한 내용이고 책에서 워낙 많이 나오는 내용이라 한번 보고 당연하다고 생각해서 넘어갔는데 실전에서 습관처럼 나오기에 체득이 안되어 있었던 듯 하다. 습관처럼 script를 뒤에 쓰다가 안먹어서 고민을 오래 했었다.이런게 주니어와 시니어의 차이라는 거겠지... 노력해야겠다.
[일기쓰듯 블로그를 운영하고 있는데 초보라 부족한 부분이 많습니다. 혹시 틀린 점이 있으면 둥글게 알려주시면 감사하겠습니다.]
댓글