描述: 当DOM准备就绪时,指定一个函数来执行。
-
添加的版本: 1.0.ready( handler )
-
handler类型: Function()当DOM准备就绪时,执行的一个函数。
-
虽然JavaScript提供了load
事件,当页面执呈现时用来执行这个事件,直到所有的东西,如图像已被完全接收前,此事件不会被触发。在大多数情况下,只要DOM结构已完全加载时,脚本就可以运行。传递处理函数给.ready()
方法,能保证DOM准备好后就执行这个函数,因此,这里是进行所有其它事件绑定及运行其它 jQuery 代码的最佳地方。当使用的脚本依赖 CSS 属性值时,需要特别注意,要保证外部的样式或内嵌的样式被加载完后,再调用脚本。
如果执行的代码需要在元素被加载之后才能使用时,(例如,取得图片的大小需要在图片被加载完后才能知道),就需要将这样的代码放到 load
事件中。
.ready()
方法通常和<body onload="">
属性是不兼容的。如果load
必须使用,要么不使用.ready()
,要么使用jQuery的.load()
方法向 window 或一些指定的元素(例如,图片)绑定 load
事件。
以下三个语法全部是等价的:
-
$(document).ready(handler)
-
$().ready(handler)
(this is not recommended) -
$(handler)
还有$(document).bind("ready", handler)
。该方法在从 jQuery 1.8 开始不再建议使用。这种用法的行为和 ready 方法类似,只有一点不同:如果 .ready() 方法已经被执行,再试图进行 .bind("ready")
的话,此时通过 .bind("ready")
绑定的函数是不会被立刻执行的,而是在使用上述三种方法之一进行绑定的函数执行完后,才会执行通过这种方法绑定的 ready 事件处理。(注:如果同时使用 .ready() 方法和 $(document).bind(“ready”, handler) 的话,那么始终会先执行 .ready(),再执行通过 bind 绑定的事件。)
.ready()
方法方法只能被匹配当前文档的 jQuery 对象调用,因此选择符可能被省略。
.ready()
方法通常用于一个匿名函数:
1
2
3
|
|
这等价于调用:
1
2
3
|
|
如果.ready()
在DOM被初始化后被调用,新的处理函数通过将立即执行。
Aliasing the jQuery Namespace
当使用其他JavaScript库时,我们不妨调用$.noConflict()
以避免命名空间中的混淆。当这个函数被调用,$
快捷方式将不再可用,迫使我们每次将写$
的时候,写jQuery
代替 。然而,处理函数传递给.ready()
方法可以带一个参数,这个参数就是全局的jQuery
对象。这意味着我们可以重新命名上下文对象内的.ready()
处理函数,而不影响其他代码:
1
2
3
|
|
例子:
显示当DOM加载的信息。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
|
转载请注明:悠然品鉴 » jQuery .ready() 用法 手册 | 示例代码