首页 > 代码库 > jQuery应用
jQuery应用
1.连写
对于发生在同一个jQuery对象上的一组动作,可以直接连写而无需重复获取对象。
2.库导入
<Script src="http://www.mamicode.com/jquery.js" type="text/javascript"></Script>
3.使用
如:在页面载入后弹出一个对话框
<Script type="text/javascript">
$( function(){
alert("Hello world!");
}
)
</Script>
4.jQuery对象与Dom对象是不同的。所以jQuery对象的属性方法不能被Dom对象直接调用,反之亦然。
jQuery是一组相同Dom对象的数组。将jQuery对象转换为Dom对象,可以:
1>使用数组下标
$( function(){
var $li = $("li");
var li = $li[0];
alert(li.innerHtml);
}
)
2>使用jQuery对象的Get()方法,传递一个索引值
$( function(){
var $li = $("li");
var li = $li.get(0);
alert(li.innerHtml);
}
)
将一个Dom对象转为jQuery对象:
1>直接使用$()函数
$( function(){
var li = document.getElementById("li");
var $li = $( li[0] );
alert($li.html());
}
)
2>直接把Dom数组传递给$()
$( function(){
var li = document.getElementById("li");
var $li = $( li );
alert($li.html());
}
)
注:jQuery是一个类数组,而不数组类型的数据。
5.jQuery.ready与window.Load比较
1>Load在网页中所有元素加载完才会执行。可能会出现的情况是网页已显示出来,但一部分音频文件未加载完,所以Load事件这里也不执行。
ready事件在Dom绘制完毕后执行。这时即使有未加载完的音频也会执行。
ready先于Load执行。只有在网页没有外部文件需要加载的情况下近乎同时执行。
2>Load只会影响最后一次的事件处理过程
如:Window.onLoad = function (){
alert("1");
}
Window.onLoad = function (){
alert("2");
}
只有"2"的处理过程被执行
而,jQuery的ready可被多次执行
$( function(){
alert("1");
}
)
$( function(){
alert("2");
}
)
这样有利于复杂的初始化操作。
jQuery应用