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学习笔记之获取当前目录的实现代码
Dec 14 Javascript
关于JavaScript中var声明变量作用域的推断
Dec 16 Javascript
Jquery右下角抖动、浮动 实例代码(兼容ie6、FF)
Aug 15 Javascript
简单时间提示DEMO从0开始一直进行计时
Nov 19 Javascript
jquery修改属性值实例代码(设置属性值)
Jan 06 Javascript
Javascript学习笔记之函数篇(五) : 构造函数
Nov 23 Javascript
JavaScript弹出新窗口后向父窗口输出内容的方法
Apr 06 Javascript
RequireJs的使用详解
Feb 19 Javascript
微信小程序使用modal组件弹出对话框功能示例
Nov 29 Javascript
详解npm 配置项registry修改为淘宝镜像
Sep 07 Javascript
JavaScript数组特性与实践应用深入详解
Dec 30 Javascript
uin-app+mockjs实现本地数据模拟
Aug 26 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
Yii2框架中使用PHPExcel导出Excel文件的示例
2017/08/09 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
JavaScript中的一些定位属性[图解]
2010/07/14 Javascript
在JS中最常看到切最容易迷惑的语法(转)
2010/10/29 Javascript
js使用函数绑定技术改变事件处理程序的作用域
2011/12/26 Javascript
获取鼠标在div中的相对位置的实现代码
2013/12/30 Javascript
js实现简单的省市县三级联动效果实例
2016/02/18 Javascript
javascript中apply、call和bind的使用区别
2016/04/05 Javascript
Vue.js组件tab实现选项卡切换
2020/03/23 Javascript
如何在AngularJs中调用第三方插件库
2017/05/21 Javascript
详解Angular之constructor和ngOnInit差异及适用场景
2017/06/22 Javascript
JavaScript之生成器_动力节点Java学院整理
2017/06/30 Javascript
vue滚动tab跟随切换效果
2020/06/29 Javascript
Javascript生成器(Generator)的介绍与使用
2021/01/31 Javascript
Python实现模拟登录及表单提交的方法
2015/07/25 Python
浅谈Python爬取网页的编码处理
2016/11/04 Python
详解Python里使用正则表达式的ASCII模式
2017/11/02 Python
Python实现的HMacMD5加密算法示例
2018/04/03 Python
Python简单读写Xls格式文档的方法示例
2018/08/17 Python
Python时间和字符串转换操作实例分析
2019/03/16 Python
在VS2017中用C#调用python脚本的实现
2019/07/31 Python
使用python将excel数据导入数据库过程详解
2019/08/27 Python
使用python无账号无限制获取企查查信息的实例代码
2020/04/17 Python
selenium判断元素是否存在的两种方法小结
2020/12/07 Python
pycharm 关闭search everywhere的解决操作
2021/01/15 Python
戴尔英国官网:Dell英国
2017/05/27 全球购物
Vans(范斯)新西兰官方网站:美国原创极限运动品牌
2020/09/19 全球购物
描述RIP和OSPF区别以及特点
2015/01/17 面试题
还款承诺书范文
2014/05/20 职场文书
抗震救灾标语
2014/06/26 职场文书
物流专业求职信
2014/06/30 职场文书
户籍证明书标准模板
2014/09/10 职场文书
2014第二批党员干部对照“四风”找差距检查材料思想汇报
2014/09/18 职场文书
小组组名及励志口号
2015/12/24 职场文书
六五普法心得体会2016
2016/01/21 职场文书
centos8安装nginx1.9.1的详细过程
2021/08/02 Servers