jQuery数组处理代码详解(含实例演示)


Posted in Javascript onFebruary 03, 2012

演示所用数组

var _mozi=['墨家','墨子','墨翟','兼爱非攻','尚同尚贤'];

1. $.each遍历示例[常用]

$.each(_mozi,function(key,val){ 
//回调函数有两个参数,第一个是元素索引,第二个为当前值 
alert('_mozi数组中 ,索引 : '+key+' 对应的值为: '+val); 
});

2. $.grep()过滤数组[常用]

$.grep(_mozi,function(val,key){ 
//过滤函数有两个参数,第一个为当前元素,第二个为元素索引 
if(val=='墨子'){ 
alert('数组值为 墨子 的下标是: '+key); 
} 
}); 
var _moziGt1=$.grep(_mozi,function(val,key){ 
return key>1; 
}); 
alert('_mozi数组中索引值大于1的元素为: '+_moziGt1); 
var _moziLt1=$.grep(_mozi,function(val,key){ 
return key>1; 
},true); 
//此处传入了第三个可靠参数,对过滤函数中的返回值取反 
alert('_mozi数组中索引值小于等于1的元素为: '+_moziLt1);

3. $.map()按给定条件转换数组[一般]

var _mapArrA=$.map(_mozi,function(val){ 
return val+'[新加]'; 
}); 
var _mapArrB=$.map(_mozi,function(val){ 
return val=='墨子' ? '[只给墨子加]'+val : val; 
}); 
var _mapArrC=$.map(_mozi,function(val){ 
//为数组元素扩展一个新元素 
return [val,(val+'[扩展]')]; 
}); 
alert('在每个元素后面加\'[新加]\'字符后的数组为: '+ _mapArrA); 
alert('只给元素 墨子 添加字符后的数组为: '+ _mapArrB); 
alert('为原数组中每个元素,扩展一个添加字符\'[新加]\'的元素,返回的数组为 '+_mapArrC);

4. $.inArray()判断值是否存在于数组中[常用]
 

var _exist=$.inArray('墨子',_mozi); 
var _inexistence=$.inArray('卫鞅',_mozi) 
if(_exist>=0){ 
alert('墨子 存在于数组_mozi中,其在数组中索引值是: '+_exist); 
} 
if(_inexistence<0){ 
alert('卫鞅 不存在于数组_mozi中!,返回值为: '+_inexistence+'!'); 
}

5. $.merge()合并两个数组[一般]

//原生concat()可能比它还简洁点 
_moziNew=$.merge(_mozi,['鬼谷子','商鞅','孙膑','庞涓','苏秦','张仪']) 
alert('合并后新数组长度为: '+_moziNew.length+'. 其值为: '+_moziNew);

6. $.unique()过滤数组中重复元素[不常用]

var _h2Arr=$.makeArray(h2obj); 
//将数组_h2Arr重复一次 
_h2Arr=$.merge(_h2Arr,_h2Arr); 
var _curLen=_h2Arr.length; 
_h2Arr=$.unique(_h2Arr); 
var _newLen=_h2Arr.length; 
alert('数组_h2Arr原长度值为: '+_curLen+' ,过滤后为: '+_newLen 
+' .共过滤 '+(_curLen-_newLen)+'个重复元素')

7. $.makeArray()类数组对象转换为数组[不常用]

var _makeArr=$.makeArray(h2obj); 
alert('h2元素对象集合的数据类型转换为: '+_makeArr.constructor.name);

8. $.toArray()将所有DOM元素恢复成数组[不常用]

var _toArr=$('h2').toArray(); 
alert('h2元素集合恢复后的数据类型是: '+_toArr.constructor.name);
Javascript 相关文章推荐
用jquery实现自定义风格的滑动条实现代码
Apr 26 Javascript
基于jquery实现的图片在各种分辨率下未知的容器内上下左右居中
May 11 Javascript
基于jQuery实现简单的折叠菜单效果
Nov 23 Javascript
js 判断一组日期是否是连续的简单实例
Jul 11 Javascript
两种简单的跨域方法(jsonp、php)
Jan 02 Javascript
jQuery.Validate表单验证插件的使用示例详解
Jan 04 Javascript
javascript笔记之匿名函数和闭包
Feb 06 Javascript
关于javascript作用域的常见面试题分享
Jun 18 Javascript
微信小程序slider组件使用详解
Jan 31 Javascript
详解Vue Elementui中的Tag与页面其它元素相互交互的两三事
Sep 25 Javascript
利用Node.js如何实现文件循环覆写
Apr 05 Javascript
Vue生命周期activated之返回上一页不重新请求数据操作
Jul 26 Javascript
8款非常棒的响应式jQuery 幻灯片插件推荐
Feb 02 #Javascript
JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码
Feb 02 #Javascript
JavaScript初学者应注意的七个细节小结
Jan 30 #Javascript
面向对象的Javascript之三(封装和信息隐藏)
Jan 27 #Javascript
面向对象的Javascript之二(接口实现介绍)
Jan 27 #Javascript
js String对象中常用方法小结(字符串操作)
Jan 27 #Javascript
getElementByIdx_x js自定义getElementById函数
Jan 24 #Javascript
You might like
十大“创意”战术!
2020/03/04 星际争霸
PHP中通过getopt解析GNU C风格命令行选项
2019/11/18 PHP
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
2013/08/06 Javascript
使用jQuery解决IE与FireFox下createElement方法的差异
2013/11/14 Javascript
使用JS实现jQuery的addClass, removeClass, hasClass函数功能
2014/10/31 Javascript
jquery实现倒计时功能
2015/12/28 Javascript
AngularJS基础 ng-options 指令详解
2016/08/02 Javascript
判断数组的最佳方法(推荐)
2016/10/11 Javascript
浅谈DOM的操作以及性能优化问题-重绘重排
2017/01/08 Javascript
BootStrap与Select2使用小结
2017/02/17 Javascript
Vue 使用beforeEach实现登录状态检查功能
2019/10/31 Javascript
JavaScript基于用户照片姓名生成海报
2020/05/29 Javascript
node.js基础知识汇总
2020/08/25 Javascript
[01:12:44]VG vs Mineski Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
python使用rabbitmq实现网络爬虫示例
2014/02/20 Python
用python代码做configure文件
2014/07/20 Python
python 线程的暂停, 恢复, 退出详解及实例
2016/12/06 Python
python中numpy.zeros(np.zeros)的使用方法
2017/11/07 Python
使用python编写简单的小程序编译成exe跑在win10上
2018/01/15 Python
python批量从es取数据的方法(文档数超过10000)
2018/12/27 Python
Python生成一个迭代器的实操方法
2019/06/18 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
python多维数组分位数的求取方式
2020/03/03 Python
使用tensorflow实现VGG网络,训练mnist数据集方式
2020/05/26 Python
python实现mask矩阵示例(根据列表所给元素)
2020/07/30 Python
Python实现扫码工具的示例代码
2020/10/09 Python
python中os.remove()用法及注意事项
2021/01/31 Python
CSS3 @keyframes简单动画实现
2018/02/24 HTML / CSS
浅谈HTML5新增和废弃的标签
2019/04/28 HTML / CSS
药剂学专业应届生自荐信
2013/09/29 职场文书
经典的毕业生自荐信范文
2014/04/14 职场文书
毕业生评语大全
2015/01/04 职场文书
锅炉工岗位职责
2015/02/13 职场文书
小平您好观后感
2015/06/09 职场文书
2015年城管执法工作总结
2015/07/23 职场文书
Golang Web 框架Iris安装部署
2022/08/14 Python