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 相关文章推荐
让 JavaScript 轻松支持函数重载 (Part 2 - 实现)
Aug 04 Javascript
JQuery 小练习(实例代码)
Aug 07 Javascript
基于Jquery的标签智能验证实现代码
Dec 27 Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
Jan 09 Javascript
原生JS实现轮播图效果
Oct 12 Javascript
微信小程序实现多个按钮的颜色状态转换
Feb 15 Javascript
详解axios中封装使用、拦截特定请求、判断所有请求加载完毕)
Apr 09 Javascript
js中值引用和地址引用实例分析
Jun 21 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
Jul 13 Javascript
关于Node.js中频繁修改代码重启服务器的问题
Oct 15 Javascript
微信小程序视频弹幕发送功能的实现
Dec 28 Javascript
JavaScript中关于预编译、作用域链和闭包的理解
Mar 31 Javascript
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中strcmp()和strcasecmp()函数字符串比较用法分析
2016/01/07 PHP
PHP的Yii框架中使用数据库的配置和SQL操作实例教程
2016/03/17 PHP
PHP实现的多文件上传类及用法示例
2016/05/06 PHP
关于PHP中协程和阻塞的一些理解与思考
2017/08/11 PHP
js身份证验证超强脚本
2008/10/26 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
jQuery选择器中含有空格的使用示例及注意事项
2013/08/25 Javascript
JavaScript函数模式详解
2014/11/07 Javascript
jQuery排序插件tableSorter使用方法
2017/02/10 Javascript
详解Vue中一种简易路由传参办法
2017/09/15 Javascript
原生js+cookie实现购物车功能的方法分析
2017/12/21 Javascript
详解keep-alive + vuex 让缓存的页面灵活起来
2019/04/19 Javascript
vue+mock.js实现前后端分离
2019/07/24 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
JS控制GIF图片的停止与显示
2019/10/24 Javascript
[01:13]2014DOTA2西雅图邀请赛 舌尖上的TI4
2014/07/08 DOTA
[44:21]Ti4 循环赛第四日 附加赛NEWBEE vs LGD
2014/07/13 DOTA
[01:00]一分钟回顾2018DOTA2亚洲邀请赛现场活动
2018/04/07 DOTA
[52:31]VP vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
[04:45]DOTA2-DPC中国联赛正赛 iG vs LBZS 赛后选手采访
2021/03/11 DOTA
python动态加载变量示例分享
2014/02/17 Python
Python中关键字is与==的区别简述
2014/07/31 Python
Python自然语言处理之词干,词形与最大匹配算法代码详解
2017/11/16 Python
django 环境变量配置过程详解
2019/08/06 Python
pandas 选取行和列数据的方法详解
2019/08/08 Python
Python内置方法和属性应用:反射和单例(推荐)
2020/06/19 Python
Python程序慢的重要原因
2020/09/04 Python
JRE、JDK、JVM之间的关系怎样
2012/05/16 面试题
DataList 能否分页,请问如何实现?
2015/05/03 面试题
生物化工专业个人自荐信
2013/09/26 职场文书
文史专业毕业生自荐信
2013/11/17 职场文书
学习雷锋精神心得体会范文
2014/03/12 职场文书
学校党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
SSM项目使用拦截器实现登录验证功能
2022/01/22 Java/Android
苹果电脑mac os中货币符号快捷输入
2022/02/17 杂记
GTX1650super好不好 gtx1650super显卡属于什么级别
2022/04/08 数码科技