博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
关于ready和load方法作用于不同情况下的比较
阅读量:6714 次
发布时间:2019-06-25

本文共 1490 字,大约阅读时间需要 4 分钟。

jQuery中有两个方法——ready和load。它们非常容易混淆。这里做一下区分:

jQuery中的ready特指“DOM”全部加载完毕,也就是说,只要DOM加载完毕了,这个事件自然被触发了。所谓“DOM”加载完毕指整个页面的标签部分全部加载完毕,至于说某些标签内部可能还存在着一系列事件未完成(譬如img标签可能加载远处一个很大的bmp图片尚未加载完毕等情况)则被忽略。因此对于单纯设置某些Html标签的事件或者属性的绑定而言,在ready方法中显然比load更为适合因为load必须等到全部的标签都处于完成状态,包括img把图片全部加载完毕为止)。

这里不妨给出一个现成的示例代码(纯Html):

                

注意jQuery中的$(function……)就是静止等待知道整个DOM加载完毕之后触发事件。其等同于:

1)

$.ready(function () {            alert("DOM加载完毕");        });

2)

$(document).ready(function () {            alert("DOM加载完毕");        });

如果你运行这个页面(直接在IE或者其它页面中打开),你会发觉先弹出“DOM加载完毕”的消息框,然后可能直到BMP图片加载完毕之后才会弹出“Body”加载完毕的消息。这就是它们之间最大的差别。

顺便提及一句,如果这样进行比较:

                

 运行顺序将是先弹出“DOM加载完毕”,之后才弹出“Window加载完毕”,最后弹出“Body加载完毕”。那是因为DOM的本质是document,是Window的一个属性对象。自然等到DOM加载完毕之后Window对象才表示初步构建完毕(window对象自身没有顶层对象了,其本身就是顶层对象)。而DOM初步加载完毕并不表示每一个元素都加载完毕,因此body中的那个js对话框是在最后才弹出。

关于深入理解DOM,你可以使用IE7以及以上的浏览器,或者FireFox等带有代码调试功能的浏览器;以IE为例——

随意打开一个Url(譬如“www.baidu.com”)。先按F12启用调试功能,切换到“网络”面板,点击“开始捕获“按钮,切换到“HTML”面板,随后在地址栏输入百度地址,回车。

如果你注意HTML,它会生成一个Html的TreeView,这个就是DOM(也就是document.ready)需要执行的内容,因此如果你要对一些Html标签进行设置属性等,直接可以在这个事件中去做,而不是等到document全部加在完毕了才去做;相反地,body的onload标签要到body中全部内容彻底加载完毕为止(证明就是你可以看“网络”,里边发现大量Image下载以及内部跳转等复杂信息)。

另外值得注意的是:

$(document).load是错误的,因为“load”并不是document对象的一个内置的方法;如果要人为为某个标签对象增加一个自定义事件,在jQuery中你只能使用bind方法增加一个自定义的事件,然后必须使用trigger去人为触发这个自定义事件。

转载于:https://www.cnblogs.com/ServiceboyNew/archive/2013/01/29/2869963.html

你可能感兴趣的文章
我的友情链接
查看>>
在Kali中开启ssh
查看>>
Linux系统产生随机数的6种方法
查看>>
squid-3.x 修改源代码隐藏版本号.时间、主机名等信息
查看>>
SequoiaDB 笔记
查看>>
hadoop安装
查看>>
Ubuntu 用户名 不在 sudoers文件中,此事将被报告。
查看>>
lduan HyPer-V 网络存储(三)
查看>>
SSH 命令行参数详解【英】
查看>>
DNS服务器
查看>>
notify与notifyAll的区别
查看>>
Java读取文件方法大全
查看>>
Java学习lesson 08
查看>>
MarkDown入门
查看>>
项目经理 与 敏捷开发
查看>>
安卓软件开发你知道需要学什么吗,看这里?
查看>>
必读的Python入门书籍,你都看过吗?(内有福利)
查看>>
linux基础整理0316
查看>>
alibaba.fastjson 乱序问题
查看>>
django 反向关联--blog.entry_set.all()查询
查看>>