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取得鼠标绝对位置程序代码介绍
Sep 16 Javascript
js禁止document element对象选中文本实现代码
Mar 21 Javascript
JavaScript异步编程Promise模式的6个特性
Apr 03 Javascript
Javascript 多物体运动的实现
Dec 24 Javascript
深入浅析JavaScript的API设计原则
Jun 14 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
Oct 05 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
Apr 01 Javascript
JavaScript运动框架 多值运动(四)
May 18 Javascript
详细讲解vue2+vuex+axios
May 27 Javascript
微信小程序自定义导航教程(兼容各种手机)
Dec 12 Javascript
聊聊鉴权那些事(推荐)
Aug 22 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
Apr 03 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 is_file 判断给定文件名是否为一个正常的文件
2010/05/10 PHP
php关联数组快速排序的方法
2015/04/17 PHP
PHP Hash算法:Times33算法代码实例
2015/05/13 PHP
PHP构造二叉树算法示例
2017/06/21 PHP
php命名空间设计思想、用法与缺点分析
2019/07/17 PHP
新发现一个骗链接的方法(js读取cookies)
2012/01/11 Javascript
jquery等宽输出文字插件使用介绍
2013/09/18 Javascript
Javascript中setTimeOut和setInterval的定时器用法
2015/06/12 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
2015/08/24 Javascript
JS实现网页Div层Clone拖拽效果
2015/09/26 Javascript
每天一篇javascript学习小结(面向对象编程)
2015/11/20 Javascript
深入理解JavaScript中的浮点数
2016/05/18 Javascript
Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
2016/07/10 Javascript
获取IE浏览器Cookie信息的方法
2017/01/23 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
JavaScript模板引擎应用场景及实现原理详解
2018/12/14 Javascript
微信小程序tab切换可滑动切换导航栏跟随滚动实现代码
2019/09/04 Javascript
vue表单中遍历表单操作按钮的显示隐藏示例
2019/10/30 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
2020/01/17 Javascript
JavaScript装饰者模式原理与用法实例详解
2020/03/09 Javascript
Vue中用JSON实现刷新界面不影响倒计时
2020/10/26 Javascript
约瑟夫问题的Python和C++求解方法
2015/08/20 Python
Python中运算符&quot;==&quot;和&quot;is&quot;的详解
2016/10/08 Python
Python文件操作基本流程代码实例
2017/12/11 Python
Python学习之Django的管理界面代码示例
2018/02/10 Python
对Python之gzip文件读写的方法详解
2019/02/08 Python
CSS3 渐变(Gradients)之CSS3 线性渐变
2016/07/08 HTML / CSS
英国现代家具和照明购物网站:Heal’s
2019/10/30 全球购物
如何减少垃圾回收让内存更加有效使用
2013/10/18 面试题
求职信内容考虑哪几点
2013/10/05 职场文书
后勤管理员岗位职责
2014/08/27 职场文书
2015届大学生就业推荐表自我评价
2014/09/27 职场文书
2014年初级职称工作总结
2014/12/08 职场文书
2015年大学生实习评语
2015/03/25 职场文书
java基础——多线程
2021/07/03 Java/Android
python实现局部图像放大
2021/11/17 Python