一。遍历子元素
children()方法可以用来获取元素的所有子元素
语法:$(selector).children([expr]);
示例:
var $section =$("section").children();
alert($section.length);
二。遍历同辈元素
jQuery可以获取紧邻其后、紧邻其前和位于该元素前与后的所有同辈元素
语法:
next([expr])
用于获取紧邻匹配元素之后的元素
$("li:eq(1)").next().addClass("orange");
prev([expr])
用于获取紧邻匹配元素之前的元素
$("li:eq(1)").prev().addClass("orange");
slibings([expr])
用于获取位于匹配元素前面和后面的所有同辈元素
$("li:eq(1)").siblings().addClass("orange");
三。遍历前辈元素
parent():获取元素的父级元素
parents():获取元素的祖先元素
实例:
$("li:eq(1)").parent().addClass("orange");
$("li:eq(1)").parents().addClass("orange");
四,其他遍历方法1
each( ) :规定为每个匹配元素规定运行的函数
语法: $(selector).each(function(index,element)) ;
示例
$("img").click(function(){ $("li").each(function(){ var str=$(this).text()+"<br>"; $("section").append(str); }) });
其他遍历方法2
end( ):结束当前链条中的最近的筛选操作,并将匹配元素集还原为之前的状态
实例:
$(".contain :header").css({"background":"#2a65ba","color":"#ffffff"});
$(".gameList li").first().css("background","#b8e7f9").end().last().css ("background","#d3f4b5");
$(".gameList li:last").css("border","none");
除css()外,还有获取和设置元素高度、宽度等的样式操作方法