jQuery常用过滤器

jQuery常用过滤器

jQuery的.filter()方法，这真是一个很强大的方法，最强大之处在于，他可以接受一个函数作为参数，然后根据函数的返回值判断，如果返回值是true，这个元素将被保留，如果返回值是false，这个元素将被剔除。这就是jquery选择器的过滤器。

.filter( selector )

Selector，一个用于匹配元素的选择器字符串。

var cl = console.log.bind(console);
    cl($("ul#first"));
    cl($("ul").filter("#first"));

.filter( function(index) )

function(index)，一个函数用作测试集合中的每个元素。this 是当前DOM元素。

$("p").filter(function(index){
return $(this).find("span").size();
});

.children(selector)和.find(selector)

.children(selector)方法是返回匹配元素集合中每个元素的所有子元素（仅儿子辈）。参数可选，添加参数表示通过选择器进行过滤，对元素进行筛选。find(selector)方法是返回匹配元素集合中每个元素的后代。参数是必选的，可以为选择器、jquery对象可元素来对元素进行筛选。

  // children
    var ul1 = $("ul").filter("#first");
    cl(ul1.children());
    var children = ul1.children();
    // first():第一个
    children.first().css("background", "lightblue");
    // last(): 最后一个
    children.last().css("background", "lightblue");
    // eq(n): 返回任何一个
    children.eq(2).css("background", "lightgreen");
    // children()只限子元素
    // ul1.children(".red").css("color", "red");
    // find(): 所有层级在查询
    ul1.find(".red").css("color", "red");
    cl(ul1.find(".red"));

总结

以上方法是常用的过滤选择，find是遍历当前元素集合中每个元素的后代。只要符合，不管是儿子辈，孙子辈都可以。find只在后代中遍历，不包括自己。