jquery的isReady方法(DOM是否加载完)

  1 DOMContentLoaded = function() {
  2         if ( document.addEventListener ) {
  3             document.removeEventListener( "DOMContentLoaded", DOMContentLoaded, false );
  4             jQuery.ready();
  5         } else if ( document.readyState === "complete" ) {
  6             // we‘re here because readyState === "complete" in oldIE
  7             // which is good enough for us to call the dom ready!
  8             document.detachEvent( "onreadystatechange", DOMContentLoaded );
  9             jQuery.ready();
 10         }
 11     },
 12
 13
 14 ready: function( fn ) {
 15         // Add the callback
 16         jQuery.ready.promise().done( fn );
 17
 18         return this;
 19     },
 20
 21
 22 jQuery.ready.promise = function( obj ) {
 23     if ( !readyList ) {
 24
 25         readyList = jQuery.Deferred();
 26
 27         // Catch cases where $(document).ready() is called after the browser event has already occurred.
 28         // we once tried to use readyState "interactive" here, but it caused issues like the one
 29         // discovered by ChrisS here: http://bugs.jquery.com/ticket/12282#comment:15
 30         if ( document.readyState === "complete" ) {
 31             // Handle it asynchronously to allow scripts the opportunity to delay ready
 32             setTimeout( jQuery.ready, 1 );
 33
 34         // Standards-based browsers support DOMContentLoaded
 35         } else if ( document.addEventListener ) {
 36             // Use the handy event callback
 37             document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );
 38
 39             // A fallback to window.onload, that will always work
 40             window.addEventListener( "load", jQuery.ready, false );
 41
 42         // If IE event model is used
 43         } else {
 44             // Ensure firing before onload, maybe late but safe also for iframes
 45             document.attachEvent( "onreadystatechange", DOMContentLoaded );
 46
 47             // A fallback to window.onload, that will always work
 48             window.attachEvent( "onload", jQuery.ready );
 49
 50             // If IE and not a frame
 51             // continually check to see if the document is ready
 52             var top = false;
 53
 54             try {
 55                 top = window.frameElement == null && document.documentElement;
 56             } catch(e) {}
 57
 58             if ( top && top.doScroll ) {
 59                 (function doScrollCheck() {
 60                     if ( !jQuery.isReady ) {
 61
 62                         try {
 63                             // Use the trick by Diego Perini
 64                             // http://javascript.nwbox.com/IEContentLoaded/
 65                             top.doScroll("left");
 66                         } catch(e) {
 67                             return setTimeout( doScrollCheck, 50 );
 68                         }
 69
 70                         // and execute any waiting functions
 71                         jQuery.ready();
 72                     }
 73                 })();
 74             }
 75         }
 76     }
 77     return readyList.promise( obj );
 78 };
 79
 80
 81 ready: function( wait ) {
 82
 83         // Abort if there are pending holds or we‘re already ready
 84         if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
 85             return;
 86         }
 87
 88         // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
 89         if ( !document.body ) {
 90             return setTimeout( jQuery.ready, 1 );
 91         }
 92
 93         // Remember that the DOM is ready
 94         jQuery.isReady = true;
 95
 96         // If a normal DOM Ready event fired, decrement, and wait if need be
 97         if ( wait !== true && --jQuery.readyWait > 0 ) {
 98             return;
 99         }
100
101         // If there are functions bound, to execute
102         readyList.resolveWith( document, [ jQuery ] );
103
104         // Trigger any bound ready events
105         if ( jQuery.fn.trigger ) {
106             jQuery( document ).trigger("ready").off("ready");
107         }
108     },
时间: 2025-01-10 07:10:27

jquery的isReady方法(DOM是否加载完)的相关文章

使用jquery的load方法设计动态加载,并解决浏览器前进、后退、刷新等问题

继上一篇 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题 解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后退.刷新等问题.有博友也遇到了同样的问题,接下来就针对浏览器的前进.后退.刷新进行用户体验优化. 在解决上述问题时也进行了各种search,但是大部分都是自己实现的插件,而且插件年久失修,对于新的jquery支持不佳.也有使用h5新加的history方法来实现的,由于HTML5的广泛使用,绝大部分主

使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题

一.问题分析 对于后台系统,相比大家都有所印象,知道其中的布局结构,如图: 在这种布局中我们需要将header,sidebar,footer分开,而且对于中间部分的content内容需要动态变化,即根据不同菜单定位到不同页面,而整体布局不会变化 这种布局结构对于单纯的HTML不具备这种嵌入各部分内容的能力,所以就需要我们自己来寻找或者解决这种问题,由于jquery的兼容性和使用广度比较不错,这里 使用jquery的load方法来处理这种页面布局框架. 二.load方法详解 1.定义 $(sele

关于使用jquery的load方法时被加载页面内部script失效问题的一次探索

事先声明:本文由初学者撰写,为一次探索的过程,可能有不严谨和准确的地方,望读者多多谅解并积极指正! 场景描述: 在一次前端开发过程中,我使用了一个网页模板,该模板包含一个主页和四个子页面,如下图: 具体的效果是,点击主页中的一个按钮会在弹框内显示子页面的内容,如下图: 具体的实现是在主页面中留出面板,并在点击按钮时通过jquery的load方法将子页面加载到面板中: index.html 部分代码 <div class="cd-folding-panel"> <div

jQuery和dom页面加载完成时触发的事件

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <script type="text/javascript" src="js/jquery-1.8.3.js"></script> 7 <script

window.onload 和 DOMContentLoaded区别及如何判断dom是否加载完毕

http://blog.allenm.me/2010/02/window-onload-和-domcontentloaded/ 其中使用IE不支持DOMContentLoaded,那么判断IE是否加载完DOM的一种方法:判断element的doScroll如果成功则说明DOM载入完成. http://www.cnblogs.com/haogj/archive/2013/01/15/2861950.html 见第4种方法

touchweb手机网站图片加载方法(canvas加载和延迟加载)

一.canvas图片加载 关于canvas加载,我的方法是,将文章中所有用到图片的地方,都用canvas代替,给canvas一个data-src,里面存放img的路径,通过canvas方法渲染图片.因为图片渲染需要时间,一般会给canvas一个背景,背景可以用gif图片.图片渲染好了之后把背景去掉. 我的canvas代码如下: canvasload: function () { //canvas加载图片 var imglength = $("#您的id").find("can

jQuery下实现检测指定元素加载完毕

检测元素出现方法.虽然是基于 jQuery 的,但是代码很简洁,可以修改成纯js版的. 文本 jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.len

【JS教程16】jquery文档加载完再执行

jquery文档加载完再执行 将获取元素的语句写到页面头部,会因为元素还没有加载而出错,jquery提供了ready方法解决这个问题,它的速度比原生的 window.onload 更快. <script type="text/javascript"> $(document).ready(function(){ ...... }); </script> 可以简写为: <script type="text/javascript"> $

页面全部加载完毕和页面dom树加载完毕

dom树加载完毕 $(document).ready() //原生写法document.ready = function (callback) {            ///兼容FF,Google            if (document.addEventListener) {                document.addEventListener('DOMContentLoaded', function () {                    document.rem