ie에서 DOMContentLoaded 이벤트와 비슷하게 구현해보기

테크노트 2009/09/27 23:42

load이벤트가 문서의 모든 요소들(텍스트,이미지..등)의 로딩이 완료가 되면 발생하는 이벤트인데 반해 DOMContentLoaded 이벤트는 html DOM요소가 로딩이 완료되면 발생하는 이벤트 입니다.
당연히 load이벤트보다 빨리 발생이 되고 유용하게 사용하는 이벤트 입니다

css(모양)와 html(구조)의 분리되는 코딩방식이 유용한 것처럼 js(동작)와 html(구조)또한 분리가 되어야 하기에 – 실제 프로젝트에서는 그렇게 못하는 경우가 많습니다만;; – 이럴 경우 주로 사용하게 되는 이벤트이지요. 하지만 ie에서는 지원을 하지 않기에 script태그의 defer속성을 이용하거나 아니면 js프레임웍을 이용해 쉽게 사용하곤 합니다.

위 소스는 html 문서 내에서 새로운 div 태그를 생성해서 body에 넣어주는 간단한 예제인데요
html문서 중간(body와 body사이) 에 위와 같은 js코드를 넣으면 어떻게 될까요?

ie에서는 이 경우 버그를 가지고 있습니다. 무식하게도 모든 페이지를 먹통으로 만들어 버리지요

이 문제의 해결방법은 ms의 헬프페이지에서도 제시해주고 있지만 ms에서 제시한 방법으로 회피를 못 할경우가 태반이지요 . 이럴 때도 DOMContentLoaded 이벤트를 사용하게 되면 쉽게 위의 버그를 피해갈수 있습니다.

하지만 ie에서는 그 동작을 완벽하게 보장하지 못하므로 가끔 특정상황에서는 , js프레임웍을 사용함에도 위와 같은 버그가 발생합니다. 그래서 DOMContentLoaded 이벤트와 비슷한 효과를 내도록 비슷하게 구현해 봤습니다.

<head>에 삽입

</body>뒤에 삽입

<body>안에 삽입

예제 보기


++


 

'테크노트' 카테고리의 다른 글

ie에서 DOMContentLoaded 이벤트와 비슷하게 구현해보기  (3) 2009/09/27
body에 스크롤바 없애기  (0) 2009/09/08
js를 PNG이미지 파일로 압축하기  (1) 2009/07/28
웹에서 실시간 경험하기, Comet  (0) 2009/07/13
플래시 navigateToURL() 팝업차단 문제  (2) 2009/07/10
wmode=transparent 이야기  (0) 2009/06/09
Posted by 아지:)
TAG
트랙백 0개, 댓글 3개가 달렸습니다

트랙백 주소 :: http://blog.uix.kr/trackback/33 관련글 쓰기

댓글을 달아 주세요

  1. ^^ 2009/11/12 11:53  댓글주소  수정/삭제  댓글쓰기

    요새는 블로그에 잘 안오시나봐요. ^^

    저.. 다음 뷰가 개편된 이후로 그리스몽키로 다음뷰 랭킹 보는게
    잘 안되는데 언제 시간되시면 수정해서 올려주시면 감사하겠습니다.

    날이 추워집니다. 건강 유의하시구요.

  2. 2009/12/21 10:11  댓글주소  수정/삭제  댓글쓰기

    비밀댓글 입니다