jQuery grep()方法详解及实例代码


Posted in Javascript onOctober 30, 2016

什么是jQuery.grep()?

jQuery.grep()是一个查找满足过滤函数的数组元素的函数。原始数组不受影响,返回值为数组。

用法介绍:

写法:

jQuery.grep( array, function(elementOfArray, indexInArray) [, invert ] )

参数介绍:

array

类型: Array
用于查询元素的数组。

function(elementOfArray, indexInArray)

类型: Function()

该函数来处理每项元素的比对。第一个参数是正在被检查的数组的元素,第二个参数是该元素的索引值。该函数应返回一个布尔值。this将是全局的window对象。

elementOfArray--数组元素

indexInArray--元素索引值

invert

类型: Boolean

如果“invert”为false,或没有提供,函数返回一个“callback”中返回true的所有元素组成的数组,。如果“invert”为true,函数返回一个“callback”中返回false的所有元素组成的数组。   

举例:过滤出原始数组中值不为 5,并且索引值大于 4 的元素。然后再过滤掉所有值为 9 的元素

<!DOCTYPE html>
<html>
<head>
 <style>
 div { color:blue; }
 p { color:green; margin:0; }
 span { color:red; }
 </style>
 <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
 <div></div>
 <p></p>
 <span></span>
<script>
var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];
$("div").text(arr.join(", "));
 
arr = jQuery.grep(arr, function(n, i){
 return (n != 5 && i > 4);
});
$("p").text(arr.join(", "));
 
arr = jQuery.grep(arr, function (a) { return a != 9; });
$("span").text(arr.join(", "));
 
</script>
 
</body>
</html>

则结果为:

1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1
1, 9, 4, 7, 3, 8, 6, 9, 1
1, 4, 7, 3, 8, 6, 1

感谢阅读,希望能帮助到大家,谢谢大家对本站的 支持!

Javascript 相关文章推荐
js中function()使用方法
Dec 24 Javascript
JavaScript中的some()方法使用详解
Jun 09 Javascript
详细分析JavaScript函数定义
Jul 16 Javascript
js实现内容显示并使用json传输数据
Mar 16 Javascript
JavaScript判断页面加载完之后再执行预定函数的技巧
May 17 Javascript
AngularJS中比较两个数组是否相同
Aug 24 Javascript
jquery插件bootstrapValidator表单验证详解
Dec 15 Javascript
Angular 组件之间的交互的示例代码
Mar 24 Javascript
微信小程序methods中定义的方法互相调用的实例代码
Aug 07 Javascript
玩转Koa之核心原理分析
Dec 29 Javascript
JavaScript判断浏览器运行环境的详细方法
Jun 30 Javascript
Vue仿百度搜索功能
Dec 28 Vue.js
webix+springmvc session超时跳转登录页面
Oct 30 #Javascript
js获取时间函数及扩展函数的方法
Oct 30 #Javascript
jquery ajax后台返回list,前台用jquery遍历list的实现
Oct 30 #Javascript
浅谈JS函数定义方式的区别
Oct 30 #Javascript
基于SpringMVC+Bootstrap+DataTables实现表格服务端分页、模糊查询
Oct 30 #Javascript
原生js代码实现图片放大境效果
Oct 30 #Javascript
Angular2 多级注入器详解及实例
Oct 30 #Javascript
You might like
php使HTML标签自动补全闭合函数代码
2012/10/04 PHP
PHP冒泡算法详解(递归实现)
2014/11/10 PHP
smarty缓存用法分析
2014/12/16 PHP
Zend Framework教程之路由功能Zend_Controller_Router详解
2016/03/07 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
ThinkPHP防止重复提交表单的方法实例分析
2018/05/10 PHP
使javascript也能包含文件
2006/10/26 Javascript
javascript对象的property和prototype是这样一种关系
2007/03/24 Javascript
可自己添加html的伪弹出框实现代码
2013/09/08 Javascript
javascript实现类似java中getClass()得到对象类名的方法
2015/07/27 Javascript
Jquery Ajax Error 调试错误的技巧
2015/11/20 Javascript
移动端js触摸事件详解
2016/09/18 Javascript
浅谈JS函数定义方式的区别
2016/10/30 Javascript
关于 jQuery Easyui异步加载tree的问题解析
2016/12/06 Javascript
Bootstrap 模态框(Modal)插件代码解析
2016/12/21 Javascript
Vue响应式添加、修改数组和对象的值
2017/03/20 Javascript
Javascript别踩白块儿(钢琴块儿)小游戏实现代码
2017/07/20 Javascript
Angular2中监听数据更新的方法
2018/08/31 Javascript
详解React 的几种条件渲染以及选择
2018/10/23 Javascript
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
2020/04/14 Javascript
详解如何修改 node_modules 里的文件
2020/05/22 Javascript
python实现网页链接提取的方法分享
2014/02/25 Python
python3.4用函数操作mysql5.7数据库
2017/06/23 Python
python查找指定文件夹下所有文件并按修改时间倒序排列的方法
2018/10/21 Python
Django添加KindEditor富文本编辑器的使用
2018/10/24 Python
python基于itchat模块实现微信防撤回
2019/04/29 Python
Python随机函数库random的使用方法详解
2019/08/21 Python
Python使用pymysql模块操作mysql增删改查实例分析
2019/12/19 Python
python实现可下载音乐的音乐播放器
2020/02/25 Python
英国钻石公司:British Diamond Company
2020/02/16 全球购物
中医专业职业生涯规划书范文
2014/01/04 职场文书
《棉鞋里的阳光》教学反思
2014/04/24 职场文书
公安四风对照检查材料思想汇报
2014/10/11 职场文书
单位接收函范文
2015/01/30 职场文书
学生通报表扬范文
2015/05/04 职场文书
学校证明范文
2015/06/24 职场文书