代码之家  ›  专栏  ›  技术社区  ›  Tomalak

如何计算jQuery对象中特定类型的所有元素?

  •  2
  • Tomalak  · 技术社区  · 14 年前

    假设我有一个内容不确定的jQuery对象(来自 something 可以是动态选择器或HTML字符串):

    var $o = $(something);
    

    举个例子,我该怎么数 <div> 在jQuery对象本身中 (即没有包含元素的后代)?我能做到

    var l = $o.filter( function () { return $(this).is("div"); } ).length;
    

    2 回复  |  直到 14 年前
        1
  •  7
  •   Felix Kling    14 年前

    .filter() 需要一个选择器,所以

    $o.filter('div')
    

    当然,你可以为此创建一个插件:

    $.fn.count = function(selector) {  
        return this.filter(selector).length; 
    }; 
    
        2
  •  6
  •   Peter Ajtai    14 年前

    有两种方法可以计算jQuery对象中特定类型的元素。你使用哪种方法取决于你对 in

    1. .find() .长度 -查找由符合模式的jQuery对象表示的DOM元素的所有子元素。也可以使用窗体的上下文 $(this, that) 在里面找到这个。它是用 .find()

    2. .filter() .长度 -减少jQuery对象表示的选定DOM元素集,使其仅包含与模式匹配的元素。


    .find()

    $o.find("div").length
    

    $("div", $o).length
    

    例如

    <li>
        <div></div>
        <div></div>
    </li>
    

    对于以上内容:

    $("li").find("div").length // This is 2
    $("div", "li").length      // This is 2
    
    $("li").filter("div").length // This is 0
    

    .filter()

    <div class="a"></div>
    <div></div>
    

    对于上述

    $("div").filter(".a").length // This is 1
    
    $("div").find(".a").length // This is 0
    $(".a", "div").length      // This is 0
    

    jsFiddle 显示两者 在工作中。