jQuery grep()方法

jQuery grep()方法

jQuery中的这个grep()方法是用来寻找满足过滤功能的数组元素的。

语法:

jQuery.grep(array, function(element, index) [, invert])

参数:该方法接受上面提到的和下面描述的两个参数。

  • array。该参数持有类似数组的对象,用于搜索。
  • function(element, index)。这是一个过滤函数,需要两个参数,element是数组中的元素,index是该特定元素的索引。
  • invert:如果是false或者没有传递,那么该函数返回一个包含所有 “callback “返回为true的元素的数组。如果传为true,那么函数返回一个数组,其中所有 “callback “返回false的元素。

返回值:它返回满足过滤功能的元素。

例子1:在这个例子中,grep()方法被应用于数字数组,根据条件过滤一些数字。它并不影响原始数组。

<!DOCTYPE html> 
<html>
  
<head> 
    <title> 
        JQuery | grep() method
    </title>
      
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
    </script>
</head>
  
<body style="text-align:center;"> 
      
    <h1 style="color:green;"> 
        GeeksforGeeks 
    </h1> 
      
    <p id="GFG_UP" style =
        "font-size: 20px; font-weight: bold"> 
    </p>
      
    <button onclick = "GFG_Fun();"> 
        click here 
    </button> 
      
    <p id="GFG_DOWN" style = "font-size: 26px;
            font-weight: bold; color: green;"> 
    </p> 
      
    <script> 
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
          
        var arr = [ 1, 9, 3, 8, 6, 1, 5, 9,
                    4, 7, 3, 8, 6, 9, 1 ];
                      
        up.innerHTML = "Click on the button to "
                + "perform the operation.<br>"
                + "Array - <br>[" + arr + "]";
                  
        function GFG_Fun() {
            var d = $.grep(arr, function( n, i ) {
                return ( n !== 7 && i > 4 );
            });
              
            down.innerHTML = JSON.stringify(d);
        } 
    </script> 
</body> 
  
</html>

输出:
jQuery grep()方法

例子2:在这个例子中,grep()方法被应用在JavaScript对象的数组上,根据条件过滤掉一些对象。这个方法并不影响原始数组。

<!DOCTYPE html> 
<html>
      
<head> 
    <title> 
        JQuery | grep() method
    </title>
      
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> 
    </script>
</head>
  
<body style="text-align:center;"> 
      
    <h1 style="color:green;"> 
        GeeksforGeeks 
    </h1> 
      
    <p id="GFG_UP" style=
        "font-size: 20px; font-weight: bold"> 
    </p>
      
    <button onclick = "GFG_Fun();"> 
        click here 
    </button>
      
    <p id="GFG_DOWN" style="font-size: 26px;
        font-weight: bold; color: green;"> 
    </p> 
      
    <script> 
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
          
        var data = [
            {"prop_1":"val_11", "prop_2":"val_12"},
            {"prop_1":"val_21", "prop_2":"val_22"},
            {"prop_1":"val_11", "prop_2":"val_22"},
            {"prop_1":"val_61", "prop_2":"val_52"},
            {"prop_1":"val_21", "prop_2":"val_52"},
            {"prop_1":"val_61", "prop_2":"val_12"}
        ];
          
        up.innerHTML = "Click on the button to "
                + "perform the operation.<br>"
                + "JSON - <br>" + JSON.stringify(data);
                  
        function GFG_Fun() {
            var d = $.grep(data, function(n, i){
                return n.prop_1==='val_11';
            });
              
            down.innerHTML=JSON.stringify(d);
        } 
    </script> 
</body>
  
</html>

输出:
jQuery grep()方法

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程