jQuery筛选
1.过滤
eq(index|-index) // 获取集合中第[index]个元素，[-index]倒数。返回JQ对象
first() // 获取集合中第一个元素。返回JQ对象
last() // 获取集合中最后一个元素。返回JQ对象
slice(start,[end]) // 依据位置下标，获取集合中的部分子集。返回JQ对象
map(callback) // 遍历集合中每个元素执行一次函数，返回新的集合
has(expr|ele) // 获取包含特定要求的元素(传参选择器或DOM对象)。返回JQ对象
hasClass(class) // 检查是否含有某个类，返回布尔值
is(expr|obj|ele|fn) // 检查集合中是否有符合要求的元素(传参选择器，JQ对象，DOM对象，函数)，返回布尔值
filter(expr|obj|ele|fn) // 筛选出与指定表达式匹配的元素集合(传参选择器，JQ对象，DOM对象)。返回JQ对象
not(expr|ele|fn) // 删除与指定表达式匹配的元素(传参选择器，DOM对象，函数)用法：
<html>
<p>A</p>
<p class="a">B</p>
<p>C<span></span></p>
</html>
<script>
$("p").eq(0).css("color", "red"); //"A"显示为红色
$("p").first().css("color", "green"); //"A"显示为绿色
$("p").last().css("color", "red"); //"C"显示为红色
$("p").slice(0,2).css("color", "blue"); //"A","B"显示为蓝色 ([0]至[2],不包含[2])
$("p").slice(0,-1).css("color", "pink"); //"A","B"显示为粉色 ([0]至倒数第一个，不包含倒数第一个)
$("p").has("span").css("color", "blue"); //"C"显示为蓝色 (含有span元素的p)
$("p").filter(".a").css("color", "blue"); //"B"显示为蓝色 (含有class="a"元素的p)
$("p").not(".a").css("color", "yellow"); //"A","C"显示为黄色 (不含class="a"元素的p)
$("p").filter(function(index) {
return $("span", this).length == 1; //"C"显示为红色 (含有一个span元素的p)
}).css("color","red");
$("p").not(function(){
return $("span", this).length == 1; //"A","B"显示为蓝色 (含span元素个数不为1的p)
}).css("color","blue");
$("p").map(function(i,d){ //i是每个元素对应下标，d是该元素DOM对象
return $(this).text(i+"|"+d.tagName)
}); //页面显示: 0|P 1|P 2|P
$("p").hasClass("a"); //返回 true (集合中有元素的class="a")
$("span").parent().is("p"); //返回true (span元素的父元素是p元素)
$("p").is(function(){ //返回true
return $("span").length==1; //集合中，包含span元素的个数是否等于1
});
</script>2.查找
children([expr]) // 获取子元素中匹配的元素(传参选择器)。返回JQ对象
find(e|o|e) // 获取后代元素中匹配的元素(传参选择器，JQ对象,DOM对象)。返回JQ对象
offsetParent() // 获取最近的定位父元素。返回JQ对象
parent([expr]) // 获取父元素。返回JQ对象
parents([expr]) // 获取所有祖辈元素，不包括根元素。返回JQ对象
parentsUntil([e|e][,f]) // 获取部分祖辈元素，从这个倒那个之间的祖辈元素(由外向内)。返回JQ对象
next([expr]) // 获取同级下一个元素(传参选择器)。返回JQ对象。
nextAll([expr]) // 获取同级后所有元素(传参选择器)。返回JQ对象。
nextUntil([e|e][expr]) // 获取同级后面元素，直到遇到匹配的那个元素为止。
prev([expr]) // 获取同级上一个元素(传参选择器)。返回JQ对象。
prevAll([expr]) // 获取同级前所有元素(传参选择器)。返回JQ对象。
prevUntil([e|e][,f]) // 获取同级前面元素，直到遇到匹配的那个元素为止。
siblings([expr]) // 获取所有同级元素，不包含自己。
closest(e,[c|o|e) // 1.7-jQuery 1.3新增，1.7后删除。从元素本身开始，逐级向上级元素匹配，并返回最先匹配的元素。用法：
<html>
<div id="a1">
<h1></h1>
<p>A</p>
<p>B<span>b</span></p>
<div id="a2">
<p>n</p>
<span class="b">m</span>
</div>
<p class="a">C</p>
</div>
</html>
<script>
$("div").children().css("color","green"); // 全部显示绿色
$("div").children("span,.a").css("color","red"); // "m","C"显示红色
$("div").find("span,.a").css("color","green"); // "b","m","C"显示绿色
$("span").parent().css("color","red"); // "B","b","n","m"显示为红色
$("span").parent("p").css("color","green"); // "B","b"显示为绿色
$("p").parents("div").length; // 返回 2
$(".a").parents("div").length; // 返回 1
$(".b").parentsUntil("#a1","#a2")[0].id; // 返回 a2
$("p").next().length; // 返回 3
$("p").next("div").length; // 返回 1
$("p").next("div")[0].id; // 返回 a2
$("h1").nextAll().length; // 返回 4
$("h1").nextAll()[0].tagName; // 返回 P
$("h1").nextAll()[2].tagName; // 返回 DIV
</script>3.串联
add(e|e|h|o[,c]) // 1.9*连接2个对象集合成一个对象集合(传参选择器，JQ对象，DOM对象，html表达式，)
addBack(elel0) // 1.9+将先前所选的加入当前元素中
contents() // 查找匹配元素内部所有的子节点（包括文本节点）。如果元素是一个iframe，则查找文档内容
end() // 回到最近的一个"破坏性"操作之前。即，将匹配的元素列表变为前一次的状态。
andSelf() // 1.8-在jQuery1.8和更高版本中应使用.addBack()代替。用法：
<html>
<div>
<p></p>
<p></p>
<div class="a">
<p></p>
<span></span>
</div>
</div>
</html>
<script>
$("span").add("p").length; //返回 4
$("span").add($("p")).length; //返回 4
$("span").add("p")[3].tagName; //返回 SPAN (按照html代码中顺序)
$("p").add("span")[3].tagName; //返回 SPAN
$("span").add("<em>123</em>")[1].tagName; //返回 EM 创建一个对象加入 $("span")集合中
$("div").find("span").addBack().length; //返回 3 (1个span再加上2个div)
$("div").find("span").addBack()[2].tagName; //返回 SPAN
$("div").find("span").addBack(".a").length; //返回 2 (1个span再加上class="a"的1个div)
$(".a").contents().not("p").wrap("<b/>"); //将 .a 子元素中非p元素节点包裹一层 b 标签
$("iframe").contents().find("body").append("123"); //在iframe中插入"aaa"
$("div").find("span").end(); //即回到 $("div")
$("div").length; //返回 2
$("div").find("span").length; //返回 1
$("div").find("span").end().length; //返回 2
</script>本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
