jQuery 什么是文档就绪的,应该如何使用?
示例
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 //空选择,这将无效 $("#myDiv").text("Hello"); </script> <div id="myDiv">Text</div>
请注意,可以通过将自定义处理程序传递给方法来为jQuery命名空间添加别名。这在其他JS库使用与jQuery相同的缩短别名( 会产生冲突)的情况下很有用。为了避免这种冲突,您必须调用-这迫使您仅使用默认的jQuery名称空间(而不是短别名)。通过将自定义处理程序传递给处理程序,您将能够选择别名来使用jQuery。.ready()$$.noConflict();$
.ready()
$.noConflict(); jQuery( document ).ready(function( $ ) { //在这里我们可以使用'$'作为jQuery别名,而不会与其他冲突 //使用相同名称空间的库 $('body').append('<div>Hello</div>') }); jQuery( document ).ready(function( jq ) { //在这里,我们使用自定义jQuery别名“jq” jq('body').append('<div>Hello</div>') });
使用该$(document).ready函数不仅可以将jQuery代码放在页面底部,还可以确保所有HTML元素均已呈现,并且整个文档对象模型(DOM)已准备就绪,可以执行JavaScript代码。