jQuery selector和filter()的区别用法及代码示例

jQuery 选择器： 允许我们选择和操作 HTML 元素。它用于使用 jQuery 选择器选择 HTML 元素，例如 id、类、类型、属性等，然后将任何 CSS 属性或事件添加到所选 HTML 元素。

用法:要选择按钮标签，语法为

$("button")

例子：

HTML


<!DOCTYPE html> 
<html> 
  
<head> 
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> 
    </script> 
    <script> 
        $(document).ready(function() { 
            $("button").click(function() { 
                $("#heading").css("border", "2px solid red"); 
            }); 
        }); 
    </script> 
</head> 
  
<body> 
  
    <h2 id="heading">Using jQuery Filter</h2> 
  
    <button>Click to change color of heading</button> 
  
</body> 
  
</html>

输出：单击该按钮后，我们将看到标题上有一个红色边框。

单击按钮创建跨标题的边框

filter()此方法用于指定 HTML 元素的条件。Filter()方法返回符合特定条件的元素。

用法:

$(selector).filter(criteria, function(index))

例子：

HTML


<!DOCTYPE html> 
<html> 
  
<head> 
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> 
    </script> 
    <script> 
        $(document).ready(function() { 
            $("p").filter(".active").css("background-color", "red"); 
        }); 
    </script> 
</head> 
  
<body> 
  
    <h1>Jquery Filter</h1> 
  
      
<p>My name is Donald.</p> 
  
    <p class="active">Geeks</p> 
  
    <p class="dead">SkeeG</p> 
  
    <p class="active">For </p> 
  
    <p class="dead">roF</p> 
  
    <p class="active">Geeks</p> 
  
</body> 
  
</html>

输出：过滤器搜索活动类标签并为其着色。

过滤活动类别

jQuery 中选择器和 filter() 之间的主要区别：

jQuery 中的选择器	filter() n jQuery
jQuery 选择器根据您给出的元素名称选择所有元素。	jQuery filter( ) 通过指定选择标准向所选元素添加更多详细信息。
它独立于filter()工作，这意味着不需要将它与filter()方法一起使用。	它与选择器一起工作。通过将过滤器与您的选择器相结合，我们可以达到更高的精度。
使用它的语法如下： $(“button”) 选择 HTML 页面的所有按钮。	使用它的语法如下： $(button).filter(criteria, function(index)) 选择具有条件的按钮并对其应用函数。

jQuery 中的选择器

filter() n jQuery

jQuery 选择器根据您给出的元素名称选择所有元素。

jQuery filter( ) 通过指定选择标准向所选元素添加更多详细信息。

它独立于filter()工作，这意味着不需要将它与filter()方法一起使用。

它与选择器一起工作。通过将过滤器与您的选择器相结合，我们可以达到更高的精度。

使用它的语法如下：

$(“button”) 选择 HTML 页面的所有按钮。

使用它的语法如下：

$(button).filter(criteria, function(index)) 选择具有条件的按钮并对其应用函数。

相关用法

注：本文由纯净天空筛选整理自faizamu19大神的英文原创作品 What’s the difference between selector and filter() in jQuery?。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。