jquery遍历

一. 向上遍历的dom

1.parent父元素

$("span").parent().css({

"color":"red",

"border":"2px solid red"

})

2.parents所有的祖先元素

$("span").parents().css({

"color":"red",

"border":"2px solid red"

})

3.parentsUntil两者之间的 /返回介于两个给定元素之间的所有祖先元素

$("span").parentsUntil().css({

"color":"red",

"border":"2px solid red"

})

二.向下遍历的dom

1.children返回被选元素的所有直接子元素，该方法只会向下一级对

DOM 树进行遍历

$(".bigbox").children().toggleClass("green");

2.find返回被选元素的后代元素，一路向下直到最后一个后代

$(".bigbox").find("div").toggleClass("green");

三.水平遍历dom树

1.siblings 所有的同胞元素

$(".start").siblings().css({"color":"red","border":"2px solid red"})

2.next 下一个同胞元素

$(".start").next().css({

"color":"red",

"border":"2px solid red"

})

3.nextAll 下面所有的同胞元素

$("li.start").nextAll().css({

"color":"red",

"border":"2px solid red"

})

4.nextUntil返回介于两个给定参数之间的所有跟随的同胞元素

$("li.start").nextUntil("li:last-child").css({

"color":"red",

"border":"2px solid red"

});

5.prevl 上一个同胞元素

$(".start").prev().css("color","red")

6.prevlAll 上面所有的同胞元素

$(".start").prevlAll().css("color","red")

7.prevlUntil返回介于两个给定参数之间的所有跟随的同胞元素

$(".start").prevAll("[class!=first]").css("color","red")

四. 过滤

1.普通过滤

1-1 first() 返回被选元素的第一个元素

1-2 last() 返回被选元素的最后一个元素

1-3 not() 返回符合标准的所有元素，not() 方法与 filter() 相反

1-4 eq() 返回被选元素中带有指定索引号的元素

1-5 filter()规定一个标准。不匹配这个标准的元素会被从集合中删

除，匹配的元素会被返回

1-6 is()判断有无

五.each 遍历

1.each base

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

        内容

})

2.each i

$("img").each(function(i){

this.src="img/"+(i+1)+".jpg";

})

3.索引 + 元素

$("li").each(function(index,element){

}）

4.each 遍历数组

index指索引 ele指数组的值

$.each[56,78](,function(index,ele){

console.log(index + ":" + ele);

})

5.each 遍历json

key值得是对象里的k value指的k的值

var obj = {

"title": "搜狐视频",

"url": "https://tv.sohu.com/",

"content":"中华第一视频门户",

"visitor":"300000000"

};

//$.each(object,callback)callback回调函数

$.each(obj,function(key,value){

console.log(key + ":" + value)

})

6.json遍历

$.getJSON(" top.jpg")