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操作CheckBoxList实现全选/反选(在客服端完成)
Feb 02 Javascript
JS获取节点的兄弟,父级,子级元素的方法
Jan 09 Javascript
js获取视频时长代码
Apr 10 Javascript
window.onload使用指南
Sep 13 Javascript
jQuery模拟360浏览器切屏效果幻灯片(附demo源码下载)
Jan 29 Javascript
用jQuery获取table中行id和td值的实现代码
May 19 Javascript
网络传输协议(http协议)
Nov 18 Javascript
微信小程序 使用canvas制作K线实例详解
Jan 12 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
Apr 20 Javascript
Webpack打包css后z-index被重新计算的解决方法
Jun 18 Javascript
jquery实现楼层滚动效果
Jan 01 jQuery
react native 获取地理位置的方法示例
Aug 28 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使用COPY函数更新配置文件的方法
2015/06/18 PHP
学习php设计模式 php实现抽象工厂模式
2015/12/07 PHP
PHP registerXPathNamespace()函数讲解
2019/02/03 PHP
关于window.pageYOffset和document.documentElement.scrollTop
2011/04/05 Javascript
table对象中的insertRow与deleteRow使用示例
2014/01/26 Javascript
Jquery实现自定义弹窗示例
2014/03/12 Javascript
javascript的document.referrer浏览器支持、失效情况总结
2014/07/18 Javascript
jQuery选择器querySelector的使用指南
2015/01/23 Javascript
JavaScript实现当网页加载完成后执行指定函数的方法
2015/03/21 Javascript
JS DOM实现鼠标滑动图片效果
2020/09/17 Javascript
文本框只能输入数字的js代码(含小数点)
2016/07/10 Javascript
js自调用匿名函数的三种写法(推荐)
2016/08/19 Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
2016/10/31 Javascript
ES6深入理解之“let”能替代”var“吗?
2017/06/28 Javascript
Form表单上传文件(type=&quot;file&quot;)的使用
2017/08/03 Javascript
jQuery EasyUI结合zTree树形结构制作web页面
2017/09/01 jQuery
详解webpack4升级指南以及从webpack3.x迁移
2018/06/12 Javascript
基于Bootstrap下拉框插件bootstrap-select使用方法详解
2018/08/07 Javascript
VUE简单的定时器实时刷新的实现方法
2019/01/20 Javascript
CentOS 7下Python 2.7升级至Python3.6.1的实战教程
2017/07/06 Python
速记Python布尔值
2017/11/09 Python
利用python库在局域网内传输文件的方法
2018/06/04 Python
python脚本实现验证码识别
2018/06/07 Python
python读取图像矩阵文件并转换为向量实例
2020/06/18 Python
Python实现爬取并分析电商评论
2020/06/19 Python
基于python实现简单网页服务器代码实例
2020/09/14 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
手把手教你配置JupyterLab 环境的实现
2021/02/02 Python
美国成衣女装品牌:CHICO’S
2016/09/19 全球购物
MyBag中文网:英国著名的时尚包袋电商零售网站
2020/07/31 全球购物
简述安装Slackware Linux系统的过程
2012/05/08 面试题
中学生在校期间的自我评价分享
2013/11/13 职场文书
甲方资料员岗位职责
2013/12/13 职场文书
2014年商场国庆节活动策划方案
2014/09/16 职场文书
干部作风建设个人剖析材料
2014/10/11 职场文书
观看《杨善洲》宣传教育片心得体会
2016/01/23 职场文书