document.ready？document.ready事件和document.load事件的区别
大家好，document.ready相信很多的网友都不是很明白，包括document.ready事件和document.load事件的区别也是一样，不过没有关系，接下来就来为大家分享关于document.ready和document.ready事件和document.load事件的区别的一些知识点，大家可以关注收藏，免得下次来找不到哦，下面我们开始吧！
JS 页面加载触发事件 document.ready和onload的区别
一、使用时机不同
1、onload：当用户进入页面时就会触发。
2、document.ready：是当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
二、作用不同
1、onload：事件常用来检测访问者的浏览器类型和版本，然后根据这些信息载入特定版本的网页。
2、document.ready：是对向window.load事件注册事件的替代方法。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用所绑定的函数。
三、作用不同
1、onload：常被用来处理用户进入或离开页面时所建立的 cookies。
2、document.ready：是事件模块中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。
参考资料来源：百度百科-Javascript事件
参考资料来源：百度百科-ready(fn)
document.ready事件和document.load事件的区别
1、概念
document.ready：
是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件）；
document.load：
是onload，指示页面包含图片等文件在内的所有元素都加载完成。
2、作用
document.ready：
在DOM加载完成后就可以可以对DOM进行操作。
一般情况一个页面响应加载的顺序是，域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作Dom了。
document.load：
在document文档加载完成后就可以可以对DOM进行操作，document文档包括了加载图片等其他信息。
那么Dom Load就是在页面响应加载的顺序中的“加载图片等其他信息”之后，就可以操作Dom了。
3、加载顺序
document.ready：
文档加载的顺序：域名解析-->加载HTML-->加载JavaScript和CSS-->加载图片等非文字媒体文件。
只要<img>标签加载完成，不用等该图片加载完成，就可以设置图片的属性或样式等。
在原生JavaScript中没有Dom ready的直接方法。
document.load：
文档加载的顺序：域名解析-->加载HTML-->加载JavaScript和CSS-->加载图片等非文字媒体文件。
DOM load在加载图片等非文字媒体文件之后，表示在document文档加载完成后才可以对DOM进行操作，document文档包括了加载图片等非文字媒体文件。
例如，需要等该图片加载完成，才可以设置图片的属性或样式等。
在原生JavaScript中使用onload事件。
扩展资料
$(document).ready()和传统的方法<body onload=”load()”>相似，不同的是onload()的方法是在页面加载完成后才发生，这包括DOM元素和其他页面元素（例如图片）的加载。
而$(document).ready()所要执行的代码是在DOM元素被加载完成的情况下执行，所以，使用document.ready()方法的执行速度比onload()的方法要快。
Javascript只有在DOM元素已经定义以后才可以对其执行某种操作，jQuery使用document.ready来保证所要执行的代码是在DOM元素被加载完成的情况下执行。
document.ready和onload的区别
document.ready和onload的区别为：加载程度不同、执行次数不同、执行速度不同。
一、加载程度不同
1.document.ready：在DOM加载完成后就可以可以对DOM进行操作。一般情况一个页面响应加载的顺序是，域名解析-加载html-加载js和css-加载图片等其他信息。那么DomReady应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作Dom了。
2.onload：在document文档加载完成后就可以可以对DOM进行操作，document文档包括了加载图片等其他信息。那么Dom Load就是在页面响应加载的顺序中的“加载图片等其他信息”之后，就可以操作Dom了。
二、执行次数不同
1.document.ready：document.ready可以写多个.ready，可以执行多次，第N次都不会被上一次覆盖。
2.onload：onload只能执行一次，如果有多个，那么第一次的执行会被覆盖。
三、执行速度不同
1.document.ready：onload除了要等待DOM被创建还要等到包括大型图片、音频、视频在内的所有外部资源都完全加载。如果加载图片和媒体内容花费了大量时间，用户就会感受到定义在onload事件上的代码在执行时有明显的延迟。
2.onload：document.ready函数只需对 DOM树的等待，而无需对图像或外部资源加载的等待，从而执行起来更快。
$(document).ready()的区别
$(document).ready(...)和 window.onload事件虽然具有类似的效果，但是，它们在触发操作的时间上存在着微妙的差异。
window.onload
当一个文档完全下载到浏览器中时，会触发 window.onload事件。这意味着页面上的全部元素对 javascript而言都是可以访问的，这种情况对编写功能性的代码非常有利，因为无需考虑加载的次序。
$(document).ready()
通过$(document).ready()注册的事件处理程序，则会在 DOM完全就绪并可以使用时调用。虽然这也意味着所有元素对脚本而言都是可以访问的，但是，缺不意味着所有关联的文件都已经下载完毕。换句话说，当 HTML下载完成并解析为 DOM树之后，代码就可以运行。
END，本文到此结束，如果可以帮助到大家，还望关注本站哦！