欢迎您访问我爱IT技术网，今天小编为你分享的javascript教程：【基于jquery的has()方法以及与find()方法以及filter()方法的区别详解】，下面是详细的讲解！
基于jquery的has()方法以及与find()方法以及filter()方法的区别详解
has(selector选择器或DOM元素) 将匹配元素集合根据选择器或DOM元素为条件，检索该条件在每个元素的后代中是否存在，将符合条件的的元素构成新的结果集。
下面举一个例子：
<ul>
<li>list item 1</li>
<li>list item 2
<ul>
<li><div><span>a</span></div>list item 2-a</li>
<li>list item 2-b</li>
</ul>
</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>
$('li').has('span').css('background-color', 'red');
得到的结果如下：
这个例子可以看出：在匹配li时，要检查该li的后代元素中是否包含了span，如果包含，则该元素包含在结果中。如果不包含，那么就排除。
注意：has只起判断作用。以has参数中的选择器或DOM元素做为条件，检测原结果集中的元素是否符合。去掉不符合的元素，将符合的元素构成一个新结果集。
这与find()方法不同，find()方法是获得在当前结果集中每个元素的后代。参数（选择器、jquery集合或DOM元素）做为过滤条件，满足过滤条件的则保留，保留的是后代。而has()方法中，参数只做为条件，符合条件的，它的前元素加入新的结果集，而不是后代加入新的结果集。
$('li').find('span').css('background-color', 'red');
结果为：
filter()方法与has()方法中的参数，都是过滤条件。不同的是filter()方法，条件作用于自身；has()方法条件是作用于它的后代元素中。
以下面的例子为例：filter()方法中，条件作用于自身li，has()方法条件是作用于li的后代元素
相关问题：Jquery find与filter函数区别 说明
答：find()会在div元素内 寻找 class为classname的元素。 filter()则是筛选div的class为classname的元素。 基本是find子元素找，filter是平级找 ·find 函数是在当前对象集合的子元素中进行查询; ·filter 函数是对当前对象集合进行过滤, 利用过滤条件... >>详细
相关问题：jQuery中find()方法的疑惑
答：find() 方法获得当前元素集合中每个元素的后代，通过选择器、jQuery 对象或元素来筛眩 语法：.find(selector) 参数selector 字符串值，包含供匹配当前元素集合的选择器表达式。 详细说明： 如果给定一个表示 DOM 元素集合的 jQuery 对象，.find(... >>详细
相关问题：jquery为什么有了选择器已经很万能了，filter方法...
答：提升一点点性能。 用checkbox举个例子， var checkeds = $('input[type=checkbox]:checked');//选中的 var notCheckeds = $('input[type=checkbox]:not(:checked)');//未选中的 或者另一个办法 var checkboxes = $('input[type=checkbox]'); var... >>详细
<ul>
<li class="a">list item 1</li>
<li>list item 2
<ul>
<li><div><span>a</span></div>list item 2-a</li>
<li>list item 2-b</li>
</ul>
</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>
$('li').filter('.a').css('background-color', 'red');
结果为：
关于基于jquery的has()方法以及与find()方法以及filter()方法的区别详解的用户互动如下：