`
kongxiantao
  • 浏览: 112138 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

学习Jquery 源码 有一收获 DOM 加载 重新认识

阅读更多

刚才看Jquery源码时,看见如下,一段不明白,上网一搜,豁然开朗啊

 

 // The DOM ready check for Internet Explorer
    function doScrollCheck() {
        if ( jQuery.isReady ) {
            return;
        }

        try {
            // If IE is used, use the trick by Diego Perini
            // http://javascript.nwbox.com/IEContentLoaded/
            document.documentElement.doScroll("left");
        } catch(e) {
            setTimeout( doScrollCheck, 1 );
            return;
        }

        // and execute any waiting functions
        jQuery.ready();
    }

 

“document.documentElement.doScroll("left")”是干啥用的,

http://www.cnblogs.com/maklove/ 介绍如下,不写了,copy如下。

 

 

“在大部分前端开发中,需要在DOM树载入时马上执行一些函数,但又不愿意仅为了这一个需求而引入整个jQuery库,于是就把jQuery的ready方法提取出来,单独使用了。 当然大家可以使用windows.onload事件, 但onload在浏览器看来,就是页面上的东西(img,iframe等资源)全部都加载完毕后才能发生, 如果页面内有大的图片的话,会在页面展现后好久时间后才执行。 如果只需要对DOM进行操作,那么这时就没必要等到页面全部加载了。我们需要更快的方法。 Firefox有DOMContentLoaded事件可以轻松解决,可惜的就是IE没有。 MSDN关于JSCRIPT的一个方法有段不起眼的话,当页面DOM未加载完成时,调用doScroll方法时,会产生异常。 那么我们反过来用,如果不异常,那么就是页面DOM加载完毕了! 所以 对于Mozilla & Opera 浏览器,在dom树载入后有现成的 DOMContentLoaded 事件 对于Safari 浏览器,有document.onreadystatechange事件, 当该事件触发时,如果 document.readyState=complete时,可视为dom树已经载入 对于ie,当在iframe内时,同样有document.onreadystatechange事件, 对于ie在非iframe内时,只有不断地通过能否执行doScroll判断dom是否加载完毕。 在本例中每间隔5毫秒尝试去执行 document.documentElement.doScroll('left') 另外要注意一点:在ie8下,貌视非iframe窗口也会有document.onreadystatechange事件,另外你也可以在构建自己的JS框架时使用此函数.”

 

貌似说的有道理,暂且认为就是这样,以后实验后,在总结

 

分享到:
评论

相关推荐

    jquery 源码分析

    首先,我们来看看`jquery-1.11.1.js`,这是未压缩的jQuery源码,适合学习和理解。jQuery的核心在于它的选择器引擎(Sizzle)、DOM操作、事件处理和动画系统。在源码中,可以看到jQuery构造函数`jQuery`接收一个参数...

    jQuery源码解读

    理解 jQuery 源码有助于我们更好地利用这个库,解决实际问题,甚至定制自己的版本。通过学习源码,你可以了解到如何高效地操作 DOM,如何优雅地处理事件,以及如何编写高性能的 JavaScript 代码。这将极大地提升你的...

    jquery源码

    **jQuery源码详解** jQuery,一个轻量级、高...通过深入学习jQuery源码,我们可以理解其背后的实现机制,进一步优化我们的代码,提升开发效率。jQuery的源码充满了高效的设计和编程技巧,值得每一个前端开发者去探究。

    锋利的jQuery 源码

    《锋利的jQuery源码》是一本专注于深入解析jQuery库源码的专业书籍,旨在帮助开发者理解并掌握jQuery的核心原理和实现机制。jQuery是JavaScript库中的一个里程碑,它极大地简化了DOM操作、事件处理、动画效果以及...

    jquery实现网页图片等待延时加载Loading插件源码.zip

    在"jquery实现网页图片等待延时加载Loading插件源码.zip"中,我们可以预见到包含了一个使用jQuery编写的图片延迟加载插件。这个插件可能包含了以下关键知识点: 1. **jQuery选择器**:jQuery选择器是用于选取DOM...

    8款Jquery+html5实现无限加载瀑布流特效

    Jquery是一款广泛使用的JavaScript库,它简化了JavaScript的DOM操作、事件处理、动画制作等任务,使得开发者能够更快速、更简洁地编写JavaScript代码。在本资源中,Jquery被用来实现瀑布流布局的动态加载和交互功能...

    jQuery 源码+实例+注释

    在学习过程中,你可以尝试解决实际问题,比如实现图片轮播、表单验证、动态加载数据等,以巩固 jQuery 的应用。同时,不断探索和学习最新的前端技术,如 Vue.js, React.js 或 Angular.js,将 jQuery 的知识融入到...

    jquery源码好不容易找到的与大家分享

    总结,jQuery源码的深度探索是一次宝贵的编程之旅,它让我们看到了一个优秀JavaScript库的设计思想和实现技巧。无论你是初学者还是经验丰富的开发者,深入理解jQuery,都将对你的职业生涯产生深远影响。

    50个jquery例子源码

    1. **DOM操作**:jQuery提供了一系列方便的函数来操作DOM元素,如`$("#id")`用于选取指定ID的元素,`.find()`用于查找子元素,`.append()`和`.prepend()`用于在元素内部添加内容。 2. **事件处理**:jQuery简化了...

    锋利的Jquery 源码

    《锋利的jQuery源码》是一本专注于解析jQuery库源码的教材,旨在帮助开发者深入理解jQuery的工作原理,提升在实际项目中的应用能力和性能优化技巧。jQuery作为一个广泛使用的JavaScript库,简化了DOM操作、事件处理...

    JQUERY博客源码 JQUERY博客源码

    - **DOM操作优化**: 避免频繁操作DOM,使用`$(document).ready()`确保DOM加载完成后再执行代码。 - **缓存jQuery对象**: 将多次使用的元素存储在变量中,减少DOM查询次数。 - **使用事件代理**: 大量动态生成的...

    jquery实现的Loading图片延迟加载特效源码.zip

    理解并应用这个源码,开发者可以学习到如何利用jQuery进行事件监听、DOM操作以及性能优化,同时也可以了解到如何通过自定义插件来扩展jQuery的功能。此外,这个例子还涉及到了网页性能优化的策略,这对于任何希望...

    锋利的jQuery源码

    《锋利的jQuery源码》是一本专注于深入解析jQuery库源码的教程,旨在帮助开发者更好地理解和运用这个广泛使用的JavaScript库。jQuery简化了DOM操作、事件处理、动画制作以及Ajax交互,是前端开发的重要工具。丰富的...

    jQuery 未压缩版本源码学习

    ### jQuery未压缩版本源码学习:深入理解jQuery的初始化与选择器处理机制 #### 初始化方法:`jQuery.fn.init` 在jQuery未压缩版本源码中,`jQuery.fn.init`是核心构造函数,负责处理各种类型的输入参数,将其转换...

    韩顺平 jquery 源码 传智播客

    《深入解析jQuery源码——基于韩顺平讲解》 jQuery,作为一款广泛应用于Web开发的JavaScript库,以其简洁、易用的API深受开发者喜爱。它极大地简化了DOM操作、事件处理、动画效果以及Ajax交互等任务。韩顺平老师的...

    jquery源码讲解

    总之,深入学习jQuery源码有助于我们更高效地利用这个强大的库,理解其背后的实现原理,使我们在实际开发中游刃有余。通过实践和探索,你将能够更好地运用jQuery,创造出更加优雅、高效的前端应用。

Global site tag (gtag.js) - Google Analytics