먼저 페이지 로딩 순서:
HTML 구조를 파싱합니다.
외부 스크립트 및 스타일시트 파일을 로드합니다.
스크립트 코드를 구문 분석하고 실행합니다.
HTML DOM 모델을 구성합니다.
이미지 등 외부 파일을 불러옵니다.
페이지가 로드되었습니다.
즉,
html → 머리글 → 제목 → #text(웹페이지 제목) → 스타일 → 스타일 로드 → 스타일 구문 분석 → 링크 → 외부 스타일 시트 파일 로드 → 외부 스타일 시트 구문 분석 → 스크립트 → 외부 스크립트 파일 로드→ 외부 스크립트 파일 구문 분석 → 외부 스크립트 실행 → body → div → 스크립트 → 스크립트 로드 → 스크립트 구문 분석 → 스크립트 실행 → img → 스크립트 → 스크립트 로드 → 스크립트 구문 분석 → 스크립트 실행 → 외부 이미지 파일 로드 → 페이지 초기화가 완료됩니다.
JS 초기 로딩.
onload
는 문서가 로드될 때 호출되지 않고 페이지의 모든 요소(이미지 등 포함)가 로드될 때 호출됩니다. 다운로드하는 데 시간이 오래 걸리는 대용량 이미지가 있는 경우 이미지가 로드될 때까지 스크립트를 초기화할 수 없습니다. 심각한 경우 사용자 경험에 큰 영향을 미치게 되지만, window.onload는 대부분의 경우 쓸모가 없습니다. 일부 B/S 소프트웨어에서는 사용자 관련 기능을 제공하기 전에 페이지를 완전히 로드해야 하므로 window.onload가 "로딩" 기능을 제공할 수 있거나 페이지 내용이 매우 작아서 document.ready()가 필요하지 않습니다. all;에 따라 다양한 상황에서 onload와 Ready를 적절하게 사용해야 합니다.
onload를 사용하여 로드:
창 .onload=function (){
var currentRenderer = 'javascript'; swfUrl: "Pie3D.swf",
swfUrl: " 290", height: "210",
id: 'sampleChart', W3C에는 DOM(Document Object Model)이 로드될 때 트리거되는 DOMContentLoaded라는 이벤트가 있습니다.
방법 1:
코드 복사
코드는 다음과 같습니다.
Jquery의 $(function(){...}) $(document).ready(function(){...})(function () {
var ie = !! (window.attachEvent && !window.opera);var wk = /webkit/(d )/i.test(navigator.userAgent) && (RegExp.$1 < 525);
var fn = [] ;var run = function () { for (var i = 0; i < fn.length; i ) fn[i]() };
try { d.documentElement.doScroll('left'); run(); }
catch (err) { setTimeout (arguments. callee, 0); }
})();
else if (wk)
var t = setInterval(function () {
if (/^(loaded|complete)$ /.test (d.readyState))
clearInterval(t), run();
}, 0);
};
})();
호출 시 :
document.ready(function(){
Alert('ok');
}
방법 2:
코드 복사
코드는 다음과 같습니다
/W3C DOM2가 지원되는 경우 W3C 메서드를 사용하세요.
if (document.addEventListener){
document.addEventListener("DOMContentLoaded", te, false); else if (/MSIE/i.test(navigator.userAgent)){/IE 브라우저인 경우(지원되지 않음)
/defer 속성이 있고 문서가 로드될 때 로드될 스크립트 태그를 생성합니다.
document.write("
var script = document.getElementByIdx_x("__ie_onload");
/문서가 실제로 로드된 경우 초기화 메서드를 호출합니다.
script.onreadystatechange = function() {
if (this.readyState == 'complete') {
te();
} }
}
}
else if (/WebKit/i.test(navigator.userAgent )) { /Safari 브라우저인 경우(지원되지 않음)
/타이머를 생성하여 0.01초마다 확인하고 문서가 로드되면 초기화 메소드 호출
var _timer = setInterval( function() {
if (/loaded|complete/.test(document.readyState)) {
위의 사항 중 어느 것도 해당되지 않는 경우 최악의 옵션을 사용하십시오(이 경우 Opera 7이 여기에서 실행됩니다)
window.onload = function( e) {
te();
}
}
function te(){
Alert('ok');
}