使用jQuery操作DOM(2)

1.遍历子元素

children()方法可以用来获取元素的所有子元素

var $section =$("section").children();               获取<section>的子元素,但不包含子元素的子元素

 alert($section.length);

2.遍历同辈元素

next()             用于获取紧邻匹配元素之后的元素        $("li:eq(1)").next().addClass("orange");

prev()             用于获取紧邻匹配元素之前的元素       $("li:eq(1)").prev().addClass("orange");

slibings()        用于获取位于匹配元素前面和后面的所有同辈元素

$("li:eq3.(1)").slibings().addClass("orange");

3.遍历前辈元素

parent():获取元素的父级元素             $("li:eq(1)").parent().addClass("orange");

parents():获取元素的祖先元素            $("li:eq(1)").parents().addClass("orange");

4.其他遍历方法

each()规定为每个匹配元素规定运行的函数

$("img").click(function(){

$("li").each(function(){

var str=$(this).text()+"<br>";

$("section").append(str);

})

});

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");

5.回顾CSS-DOM操作

css()

height()   设置或返回匹配元素的高度

width()    设置或返回匹配元素的宽度

offset()    返回以像素为单位的top和left坐标

offsetParent()   返回最近的已定位祖先元素

position()  返回第一个匹配元素相对父元素的位置

scrollLeft()  设置或返回匹配元素相对滚动条左侧的偏移

scrollTop()  设置或返回匹配元素相对滚动条顶部的偏移

原文地址:https://www.cnblogs.com/pan520/p/13223284.html