Simulate domcontentloaded events

Window. Load event

The window. onload event is triggered only when all images, scripts, links, and subboxes in the document are loaded.

Browser compatibility: All

Domcontentloaded event

When the document tree parsing in the page is complete, the document will triggerDOMContentLoadedEvent. In this case, the style sheets, image files referenced by the page, and the contained frame pages may not be loaded yet.

Browser compatibility: chrome 0.2 +, Firefox 1.0 +, ie9 +, opera 9.0 +, Safari 3.1 +

Simulate domcontentloaded

Users can't wait until all the documents are loaded before they can interact with the page. This interactive experience is also very poor, so we can only simulate browsers that do not support domcontentloaded!

Solution 1:

1/* 2 document. readystate four statuses 3 4 Uninitialized: not started loading 5 loading: loading 6 interactive: Required content loaded 7 complete: file loaded 8 */9 function domcontentloaded () {10 if (document. readystate = 'complete') {11 document. detachevent ("onreadystatechange", domcontentloaded); 12 // triggered by domcontentloaded and executed the Bound event 13} 14}; 15 16 document. attatchevent ("onreadystatechange", domcontentloaded );

 

Solution 2:

1/* 2 if the current page is a top-level window, you can simulate clicking the scroll bar every 1 ms until no exception is thrown. 3. Determine whether the page is included in the firame. Method: 4 If (window. self === window. top) {5 // the current page is the parent page 6} 7. below is the jquery judgment method, and I learned another trick (● '? '●) 8 */9 var toplevel = false; 10 try {11 // determine whether the current page is included in IFRAME 12 topleve = Window. iframeelement = NULL; 13} catch (e) {} 14 15 function doscrollcheck () {16 try {17 document.doc umentelement. doscroll ('left'); 18} catch (e) {19 setTimeout (doscrollcheck, 1); 20} 21} 22 if(document.doc umentelement. doscroll & toplevel) {23 doscrollcheck (); 24}

 

When the page contains a large amount of content or contains IFRAME, clicking the simulated scroll bar will be triggered first than onreadystatechange. Therefore, in jquery 1.7.1, the two methods are used to simulate the domcontentloaded event.