摘要：和的区别文档加载完成事件页面加载完成有两种事件一是，表示文档结构已经加载完成不包含图片等非文字媒体文件二是，指示页面包含图片等文件在内的所有元素都加载完成。即当所有链接被鼠标单击的时候，都执行也就是说页面加载时绑定，真正该触发时触发。
document.ready和onload的区别——JavaScript文档加载完成事件
页面加载完成有两种事件：
一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件）；
二是onload，指示页面包含图片等文件在内的所有元素都加载完成。
1、Dom Ready
使用jq时一般都是这么开始写脚本的：
$(function(){
// do something
});
例如：
$(function() {
$("a").click(function() {
alert("Hello world!");
});
})
这个例子就是给所有的a标签绑定了一个click事件。即当所有链接被鼠标单击的时候，都执行 alert("Hello World!");
也就是说页面加载时绑定，真正该触发时触发。
其实这个就是jq ready()的简写，它等价于：
复制代码
$(document).ready(function(){
//do something
})
//或者下面这个方法，jQuer的默认参数是：“document”；
$().ready(function(){
//do something
})
复制代码
这个就是jq ready()的方法就是Dom Ready，他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。
一般情况一个页面响应加载的顺序是，域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作Dom了。
2、Dom Load
用原生的js的时候我们通常用onload时间来做一些事情，比如：
复制代码
window.onload=function(){
//do something
}
//或者经常用到的图片
document.getElementById("imgID").onload=function(){
//do something
}
复制代码
这种就是Dom Load，他的作用或者意义就是：在document文档加载完成后就可以对DOM进行操作，document文档包括了加载图片等其他信息。
那么Dom Load就是在页面响应加载的顺序中的“加载图片等其他信息”之后，就可以操作Dom了。
最后附上一段在所有DOM元素加载之前执行的jQuery代码。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/100318.html
摘要：好久没写文章了，再来一波，首先上图参考链接与的区别详见浏览器工作原理浏览器工作原理前言页面加载完成有两种事件一是，表示文档结构结构已经加载完成不包含图片等非文字媒体文件，二是，指示页面包含图片等文件在内的所有元素都加载完成。 好久没写文章了，再来一波，首先上图： showImg(https://segmentfault.com/img/bVLD32?w=1105&h=244); 参考...
摘要：和的区别是上面定义的方法在树加载完成后就会执行，而是在页面资源比如图片和媒体资源，它们的加载速度远慢于的加载速度加载完成之后才执行。也就是说要比先执行。验证一下要比先执行执行这段代码之后，你会看到浏览器里面会先弹出在弹出。 jQuery 里面的文档就绪用法 在jQuery里面，我们可以看到两种写法:$(function(){}) 和 $(document).ready(function...
摘要：的速度明显快于重排重绘与的区别理解了浏览器是如何渲染页面之后我们再来比较这两者就很好理解了执行的时间必须等到页面内包括图片的所有元素加载完毕后才能执行。 先上图，我们再慢慢解释，这图就是浏览器加载网页的一个过程 showImg(https://segmentfault.com/img/remote/1460000008648335?w=516&h=425); 当我们在浏览器输入一个地址...
摘要：的速度明显快于重排重绘与的区别理解了浏览器是如何渲染页面之后我们再来比较这两者就很好理解了执行的时间必须等到页面内包括图片的所有元素加载完毕后才能执行。 先上图，我们再慢慢解释，这图就是浏览器加载网页的一个过程 showImg(https://segmentfault.com/img/remote/1460000008648335?w=516&h=425); 当我们在浏览器输入一个地址...
阅读 2048·2023-04-25 20:52
阅读 2400·2021-09-22 15:22
阅读 2102·2021-08-09 13:44
阅读 1742·2019-08-30 13:55
阅读 2764·2019-08-23 15:42
阅读 2258·2019-08-23 14:14
阅读 2833·2019-08-23 13:58
阅读 2906·2019-08-23 11:49
