什么是文档准备好以及我应该如何使用它
jQuery 代码通常包含在 jQuery(function($) { ... });
中,因此它只在 DOM 加载完成后运行。
<script type="text/javascript">
jQuery(function($) {
// this will set the div's text to "Hello".
$("#myDiv").text("Hello");
});
</script>
<div id="myDiv">Text</div>
这很重要,因为 jQuery(通常是 JavaScript)无法选择尚未呈现给页面的 DOM 元素。
<script type="text/javascript">
// no element with id="myDiv" exists at this point, so $("#myDiv") is an
// empty selection, and this will have no effect
$("#myDiv").text("Hello");
</script>
<div id="myDiv">Text</div>
请注意,你可以通过将自定义处理程序传递到 .ready()
方法来为 jQuery 命名空间添加别名。这对于另一个 JS 库使用与 jQuery 相同的缩短的 $
别名的情况很有用,这会产生冲突。为了避免这种冲突,你必须调用 $.noConflict();
- 这迫使你只使用默认的 jQuery 命名空间(而不是短的 $
别名)。
通过将自定义处理程序传递给 .ready()
处理程序,你将能够选择别名以使用 jQuery 。
$.noConflict();
jQuery( document ).ready(function( $ ) {
// Here we can use '$' as jQuery alias without it conflicting with other
// libraries that use the same namespace
$('body').append('<div>Hello</div>')
});
jQuery( document ).ready(function( jq ) {
// Here we use a custom jQuery alias 'jq'
jq('body').append('<div>Hello</div>')
});
使用 $(document).ready
函数不是简单地将 jQuery 代码放在页面底部,而是确保已呈现所有 HTML 元素,并且整个文档对象模型(DOM)已准备好执行 JavaScript 代码。