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 相关文章推荐
JQuery插件Style定制化方法的分析与比较
May 03 Javascript
jquery中使用循环下拉菜单示例代码
Sep 24 Javascript
jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
Jan 24 Javascript
基于jquery animate操作css样式属性小结
Nov 27 Javascript
Bootstrap页面布局基础知识全面解析
Jun 13 Javascript
JS之相等操作符详解
Sep 13 Javascript
JS常用函数和常用技巧小结
Oct 15 Javascript
vue中使用cropperjs的方法
Mar 01 Javascript
JS实现的全选、全不选及反选功能【案例】
Feb 19 Javascript
Layer.js实现表格溢出内容省略号显示,悬停显示全部的方法
Sep 16 Javascript
vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决
Sep 28 Javascript
vue使用vue-quill-editor富文本编辑器且将图片上传到服务器的功能
Jan 13 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中将字符串转化为整数(int) intval() printf() 性能测试
2020/03/20 PHP
PHP之APC缓存详细介绍 apc模块安装
2014/01/13 PHP
PHP中4个加速、缓存扩展的区别和选用建议
2014/03/12 PHP
放弃用你的InnerHTML来输出HTML吧 jQuery Tmpl不详细讲解
2013/04/20 Javascript
Javascript 实现的数独解题算法网页实例
2013/10/15 Javascript
javascript右下角弹层及自动隐藏(自己编写)
2013/11/20 Javascript
javascript搜索框点击文字消失失焦时文本出现
2014/09/18 Javascript
13 款最热门的 jQuery 图像 360 度旋转插件推荐
2014/12/09 Javascript
jQuery中prependTo()方法用法实例
2015/01/08 Javascript
jQuery的load()方法及其回调函数用法实例
2015/03/25 Javascript
node.js读取文件到字符串的方法
2015/06/29 Javascript
jQuery实现动态添加和删除一个div
2015/08/12 Javascript
Bootstrap选项卡与Masonry插件的完美结合
2016/07/06 Javascript
jquery实现input框获取焦点的方法
2017/02/06 Javascript
nodejs服务搭建教程 nodejs访问本地站点文件
2017/04/07 NodeJs
angular.js实现购物车功能
2017/10/23 Javascript
详解无限滚动插件vue-infinite-scroll源码解析
2019/05/12 Javascript
使用js在layui中实现上传图片压缩
2019/06/18 Javascript
解决layui弹出层layer的area过大被遮挡的问题
2019/09/21 Javascript
JavaScript实现京东放大镜效果
2019/12/03 Javascript
[04:13]2014DOTA2国际邀请赛 专访DC目前形势不容乐观
2014/07/12 DOTA
[43:03]LGD vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
使用Python求解最大公约数的实现方法
2015/08/20 Python
django2用iframe标签完成网页内嵌播放b站视频功能
2018/06/20 Python
浅谈pandas用groupby后对层级索引levels的处理方法
2018/11/06 Python
Python3 列表,数组,矩阵的相互转换的方法示例
2019/08/05 Python
python web框架Flask实现图形验证码及验证码的动态刷新实例
2019/10/14 Python
如何完美的建立一个python项目
2020/10/09 Python
美国领先的汽车轮胎和轮毂供应商:TireBuyer
2016/07/21 全球购物
求最大连续递增数字串(如"ads3sl456789DF3456ld345AA"中的"456789")
2015/09/11 面试题
试述DBMS的主要功能
2016/11/13 面试题
请解释流与文件有什么不同
2016/07/29 面试题
UNIX文件类型
2013/08/29 面试题
2014年中班元旦活动方案
2014/02/14 职场文书
博士导师推荐信
2015/03/25 职场文书
2015年小学重阳节活动总结
2015/07/29 职场文书