元素的内容。有如下两种办法:
$(”div”).eq(2).html(); //调用jquery目标的办法
$(”div”).get(2).innerHTML; //调用dom的办法特点
4、同一函数完成set和get
jQuery中的许多办法都是如此,首要包含如下几个:
$(” #msg”).html(); //回来id为msg的元素节点的html内容。
$(” #msg”).html(”new content”);
//将“new content” 作为html串写入id为msg的元素节点内容中,页面显现粗体的new content
$(” #msg”).text(); //回来id为msg的元素节点的文本内容。
$(” #msg”).text(”new content”);
//将“new content” 作为通常文本串写入id为msg的元素节点内容中,页面显现new content
$(” #msg”).height(); //回来id为msg的元素的高度
$(” #msg”).height(”300″); //将id为msg的元素的高度设为300
$(” #msg”).width(); //回来id为msg的元素的宽度
$(” #msg”).width(”300″); //将id为msg的元素的宽度设为300
$(”input”).val(”); //回来表单输入框的value值
$(”input”).val(”test”); //将表单输入框的value值设为test
$(” #msg”).click(); //触发id为msg的元素的单击事情
$(” #msg”).click(fn); //为id为msg的元素单击事情增加函数
相同blur,focus,select,submit事情都能够有着两种调用办法。
5、调集处理功用
关于jquery回来的调集内容无需咱们自个循环遍历并对每个目标别离做处理,jquery现已为咱们供给的很便利的办法进行调集的处理。
包含两种办法:
$(”p”).each( function (i){ this .style.color=[ '#f00' , '#0f0' , '#00f' ][ i ]})
//为索引别离为0,1,2的p元素别离设定不一样的字体色彩。
$(”tr”).each( function (i){ this .style.backgroundColor=[ '#ccc' , '#fff' ][i%2]})
//完成表格的隔行换色作用
$(”p”).click( function (){alert($( this ).html())})
//为每个p元素增加了click事情,单击某个p元素则弹出其内容
6、拓展咱们需要的功用
$.extend({
min: function (a, b){ return a < b?a:b; },
max: function (a, b){ return a > b?a:b; }
}); //为jquery拓展了min,max两个办法
运用拓展的办法(经过“$.办法名”调用):
alert(”a=10,b=20,max=”+$.max(10,20)+”,min=”+$.min(10,20));
7、支撑办法的连写
所谓连写,即能够对一个jquery目标接连调用各种不一样的办法。例如:
$(”p”).click( function (){alert($( this ).html())})
.mouseover( function (){alert(’mouse over event’)})
.each( function (i){ this .style.color=[ '#f00' , '#0f0' , '#00f' ][ i ]});
8、操作元素的款式
首要包含以下几种办法:
$(” #msg”).css(”background”); //回来元素的背景色彩
$(” #msg”).css(”background”,”#ccc”) //设定元素背景为灰色
$(” #msg”).height(300); $(”#msg”).width(”200″); //设定宽高
$(” #msg”).css({ color: “red”, background: “blue” });//以名值对的办法设定款式
$(” #msg”).addClass(”select”); //为元素增加名称为select的class
$(” #msg”).removeClass(”select”); //删去元素名称为select的class
$(” #msg”).toggleClass(”select”); //假如存在(不存在)就删去(增加)名称为select的class
9、完善的事情处理功用
jQuery现已为咱们供给了各种事情处理办法,咱们无需在html元素上直接写事情,而能够直接为经过jquery获取的目标增加事情。
$(” #msg”).click(function(){alert(”good”)}) //为元素增加了单击事情
$(”p”).click( function (i){ this .style.color=[ '#f00' , '#0f0' , '#00f' ][ i ]})
//为三个不一样的p元素单击事情别离设定不一样的处理
jQuery中几个自界说的事情:
(1)hover(fn1,fn2):一个仿照悬停事情(鼠标移动到一个目标上面及移出这个目标)的办法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。
//当鼠标放在表格的某行上时将class置为over,脱离时置为out。$(”tr”).hover(function(){$(this).addClass(”over”);},function(){$(this).addClass(”out”);});
(2)ready(fn):当DOM载入安排妥当能够查询及操作时绑定一个要履行的函数。
$(document).ready(function(){alert(”Load Success”)})//页面加载完毕提示“Load Success”,相当于onload事情。与$(fn)等价
(3)toggle(evenFn,oddFn): 每次点击时切换要调用的函数。假如点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮流调用。
//每次点击时轮换增加和删去名为selected的class。
$(”p”).toggle( function (){
$( this ).addClass(”selected”);
}, function (){
$( this ).removeClass(”selected”);
});
(4)trigger(eventtype): 在每一个匹配的元素上触发某类事情。
例如:
$(”p”).trigger(”click”); //触发一切p元素的click事情
5)bind(eventtype,fn),unbind(eventtype): 事情的绑定与反绑定
从每一个匹配的元素中(增加)删去绑定的事情。例如
$(”p”).bind(”click”, function (){alert($( this ).text());}); //为每个p元素增加单击事情
$(”p”).unbind(); //删去一切p元素上的一切事情
$(”p”).unbind(”click”) //删去一切p元素上的单击事情
10、几个有用特效功用
其间toggle()和slidetoggle()办法供给了状况切换功用。
如toggle()办法包含了hide()和show()办法。
slideToggle()办法包含了slideDown()和slideUp办法。
11、几个有用的jQuery办法
$.browser.浏览器类型:检测浏览器类型。有用参数:safari, opera, msie, mozilla。如检测是不是ie:$.browser.isie,是ie浏览器则回来true。
$.each(obj, fn):通用的迭代函数。可用于近似地迭代目标和数组(替代循环)。如
$.each( [0,1,2], function (i, n){ alert( “Item #” + i + “: ” + n ); });
等价于
var tempArr=[0,1,2];
for ( var i=0;i