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>
输出:
例子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>
输出: