css each遍历的作用,jQuery之DOM的筛选遍历each()、map()、has()

ul{

margin: 0px;

padding: 0px;

}

li{

list-style: none;

background: #ccc;

width: 200px;

margin: 10px 0px;

}

span{

display: inline-block;

width: 60px;

}

Document

• 我是p标签

• 小明15
• 小红16
• 小王18
• 小李20

/*

each()、map()、has()

each仅仅是给你遍历一遍，是没有返回的

map是遍历加返回

*/

var arr = [];

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

arr.push( $(ele).find(".name").text() );

});

console.log(arr); // (4) ["小明", "小红", "小王", "小李"]

console.log(arr.join(',')); // 小明,小红,小王,小李

console.log($("li").map(function (index, ele){

if($(ele).find(".age").text() > 16){

$(ele).css("background","orange")

return ele;

}

}));

// 找到li标签下有p标签的

$("li").has("p").css("background","red");