皮皮网

1.jQuery事件详解之$(document).ready()
2.使用js来实现jQuery的document.ready()方法

jQuery事件详解之$(document).ready()

        在页面加载结束后，浏览器会通过js为dom元素添加事件。原生的js中使用 window.onload 方法;在JQ中使用$(document).ready()。这个方法在dom载入就绪时对其进行操纵并调用执行它所绑定的函数。

        那么它和window.onload有何不同呢？

        window.onload是在网页中所有元素加上所有资源++完全加++载到浏览器后才执行。

        而$(document).ready()中绑定的事件是在dom完全就绪时就可以被调用，此时对于jQuery来说都是可以被访问的（关联的资源可能并没有被加载完毕）。

        举个例子来说，在$(document).ready()中定义了图片的宽高，但由于此时图片还没有被加载完毕，此时的宽高不会生效。要解决这个问题可以使用jQuery中的load()方法。

        load()方法会在元素的onload事件中绑定一个处理函数，如果该处理函数绑定给window对象，则会在所有资源加载完毕后触发，如果load绑定在元素上则会在该元素加载完毕后触发。

        既然window.onload比较完备为什么还要用jQuery中的$(document).ready()呢？

        window.onload事件每次只能保存对一个函数的引用，他会覆盖掉之前的函数，所以不能再现有行为上添加新的行为。如果引用了多个js文件，每个都需要window.onload方法就导致编码复杂。

        使用$(document).ready()方法能够很好地解决这种问题，每次调用$document.ready()方法都会在现有行为上追加新的行为，这些行为会根据注册顺序依次执行。

使用js来实现jQuery的document.ready()方法

       当需要在JavaScript代码中实现jQuery的页面加载完成行为，可以借助DOMContentLoaded事件。这个事件类似于$(document).ready()，它允许你在DOM加载完成后立即执行你的孤陌API源码脚本，而非等待所有资源如CSS和加载完毕。

       相比于window.onload，ddx公式源码讲解DOMContentLoaded的优势在于，即使页面资源较多，你的JavaScript代码也能尽早执行，提高用户体验。使用DOMContentLoaded事件，你可以确保你的脚本在DOM结构构建完成后就开始工作，无需等待所有外部资源。源码资本 星石

       这个主角事件在大部分现代浏览器中得到良好的支持，包括但不限于："DOMContentLoaded" | Can I use… Support tables for HTML5, CSS3, etc 的列中列出的浏览器。这意味着，软件源码安全管理只要你的目标用户使用的是这些浏览器，你的代码就可以稳定运行。

       适合的资源教程下载源码场景包括但不限于需要在页面加载初期就执行某些初始化操作，如设置样式、绑定事件等，这样可以更快地呈现用户界面。