domReady方法
来源:互联网 发布:拼命三郎网络用图 编辑:程序博客网 时间:2024/06/06 16:45
<!doctype html><html> <head> <meta charset="utf-8"> <title>赤壁之战</title> <meta http-equiv="X-UA-Compatible" content="edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="Keywords" content="赤壁之战"> <meta name="description" content="赤壁之战"> <script src="test.js" id="test"></script> </head><script> var domReady = function(fn){ if(document.addEventListener){ document.addEventListener("DOMContentLoaded",fn,false); }else{ IEContentLoaded(fn); } //IE 模拟DOMCONTENTLOADED function IEContentLoaded(fn){ var d = window.document; var done = false; var init = function(){ if(!done){ done = true; fn(); } }; (function(){ try{ //DOM 未创建之前调用DOSCROLL会抛出错误 //原理是IE下只有当DOM树构建完成后才能doScroll。但它还不是尽善尽美,它在IE下无法判定iframe的内容是否加载完毕原理是对于 IE 在非 iframe 内时,只有不断地通过能否执行 doScroll 判断 DOM 是否加载完毕。在本例中每间隔 50 毫秒尝试去执行 doScroll,注意,由于页面没有加载完成的时候,调用 doScroll 会导致异常,所以使用了 try -catch 来捕获异常。 // d.documentElement.doScroll('left'); }catch(e){ // return setTimeout(arguments.callee,50); } // 没有错误解时,就执行 init(); })(); //onreadystatechange这个事件不太可靠,比如当页面中存在图片的时候,可能反而在 onload 事件之后才能触发,换言之,它只能正确地执行于页面不包含二进制资源或非常少或者被缓存时作为一个备选吧。 d.onreadystatechange = function(){ if(d.readyState == 'complete'){ d.onreadystatechange = null; init(); } } } } var t1 = 0; domReady(function(){ var t1 = new Date().getTime(); console.log(t1) var oTitle = document.getElementById('title'); oTitle.style.color='red'; }) window.onload = function(){ var t2 = new Date().getTime(); console.log(t2-t1) }</script> <body> <h1 id="title">12121</h1></body></html>
JQ 源码
jQuery.ready.promise = function( obj ) { if ( !readyList ) { readyList = jQuery.Deferred(); // Catch cases where $(document).ready() is called after the browser event has already occurred. // we once tried to use readyState "interactive" here, but it caused issues like the one // discovered by ChrisS here: http://bugs.jquery.com/ticket/12282#comment:15 if ( document.readyState === "complete" ) { // Handle it asynchronously to allow scripts the opportunity to delay ready setTimeout( jQuery.ready, 1 ); // Standards-based browsers support DOMContentLoaded } else if ( document.addEventListener ) { // Use the handy event callback document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false ); // A fallback to window.onload, that will always work window.addEventListener( "load", jQuery.ready, false ); // If IE event model is used } else { // Ensure firing before onload, maybe late but safe also for iframes document.attachEvent( "onreadystatechange", DOMContentLoaded ); // A fallback to window.onload, that will always work window.attachEvent( "onload", jQuery.ready ); // If IE and not a frame // continually check to see if the document is ready var top = false; try { top = window.frameElement == null && document.documentElement; } catch(e) {} if ( top && top.doScroll ) { (function doScrollCheck() { if ( !jQuery.isReady ) { try { // Use the trick by Diego Perini // http://javascript.nwbox.com/IEContentLoaded/ top.doScroll("left"); } catch(e) { return setTimeout( doScrollCheck, 50 ); } // and execute any waiting functions jQuery.ready(); } })(); } } } return readyList.promise( obj );};
0 0
- domReady方法
- domReady
- 通用domReady方法,类似于jquery
- 何谓domReady
- 【整理】domReady
- DOMReady详解
- javascript的domReady
- jQuery的domReady
- domReady的实现策略
- window.onload和DOMReady
- DOMReady的实现
- domReady和onload
- 关于domReady事件的一点看法,domReady队列
- 自己构建一个domReady.js
- JS收藏——DOMReady
- 重新整理javascript的domReady函数
- jQuery DOMready 页面加载事件 研究
- 谈谈DOMContentLoaded:Javascript中的domReady引入机制
- SpannableString与SpannableStringBuilder
- Webservice学习笔记(一)简介
- 详细的SDWebImage 实现过程
- mybatis学习教程中级(七)一对多查询
- 关于TableView select常识性问题
- domReady方法
- Oracle ORA-02020 : 过多的数据库链接在使用中解决步骤
- 内核同步介绍
- svn执行clean up 操作时报错 Previous operation has not finish
- 已知字母序列【d, g, e, c, f, b, o, a】,请实现一个函数针对输入的一组字符串 input[] = {"bed", "dog", "dear", "eye"},按照字母顺序排序并打印
- 如何在Qt Creator的版本控制中应用CSDN的CODE(很详细)
- android的窗口机制分析------ViewRoot类
- UVA12589_Learning Vector
- vb.net DataGridViewCheckBox 状态