<!doctype html>jQuery数组处理详解(含实例演示)@Mr.Think


演示所用数组

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);

JQuery数组详解（含实例）的更多相关文章

  1. jQuery选择器详解及实例---《转载》

    选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写 ...

  2. jQuery.validator 详解二

    前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...

  3. jQuery.validator 详解

    jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...

  4. 3.awk数组详解及企业实战案例

    awk数组详解及企业实战案例 3.打印数组: [root@nfs-server test]# awk 'BEGIN{array[1]="zhurui";array[2]=" ...

  5. Protocol Buffer技术详解(C++实例)

    Protocol Buffer技术详解(C++实例) 这篇Blog仍然是以Google的官方文档为主线,代码实例则完全取自于我们正在开发的一个Demo项目,通过前一段时间的尝试,感觉这种结合的方式比较 ...

  6. GLSL-几何着色器详解跟实例（GS：Geometry Shader）[转]

    [OpenGL4.0]GLSL-几何着色器详解和实例(GS:Geometry Shader) 一.什么是几何着色器(GS:Geometry Shader) Input Assembler(IA)从顶点 ...

  7. CvMat、Mat、IplImage之间的转换详解及实例

    见原博客:http://blog.sina.com.cn/s/blog_74a459380101obhm.html OpenCV学习之CvMat的用法详解及实例 CvMat是OpenCV比较基础的函数 ...

  8. (转)awk数组详解及企业实战案例

    awk数组详解及企业实战案例 原文:http://www.cnblogs.com/hackerer/p/5365967.html#_label03.打印数组:1. [root@nfs-server t ...

  9. jQuery：详解jQuery中的事件（二）

    上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...

随机推荐

  1. 【CVE-2016-10009】OpenSSH < 7.4 - agent Protocol Arbitrary Library Loading

    粗看了一下,发现这个漏洞还是比较鸡肋的.如果前提条件满足,该漏洞可以在ssh server执行任意指令.不过前提是:1.攻击者可以往受害者磁盘上写文件.

  2. RabbitMQ学习系列（一）: 介绍

    1. 介绍 RabbitMQ是一个由erlang开发的基于AMQP(Advanced Message Queue )协议的开源实现.用于在分布式系统中存储转发消息,在易用性.扩展性.高可用性等方面都非 ...

  3. 命令查询网站是否开启CDN加速

    1.使用ping命令 不一定准确  运行-CMD 直接输入ping  域名 C:\Users\6503>ping www.netnic.com.cn 正在 Ping u999.v.qingcdn ...

  4. DI中Transient Scoped Singleton Instance的区别

    Observe which of the OperationId values varies within a request, and between requests. Transient obj ...

  5. 等价类划分方法的应用（jsp）

    [问题描述] 在三个文本框中输入字符串,要求均为1到6个英文字符或数字,按submit提交. [划分等价类] 条件1: 字符合法; 条件2: 输入1长度合法; 条件3: 输入2长度合法: 条件4: 输 ...

  6. HTML5 Canvas 绘图

    首先要注意: <canvas> 元素不被一些老的浏览器所支持, 但被支持于Firefox 1.5+, Opera 9+, 新版本的Safari, Chrome, 以及Internet Ex ...

  7. 3d转换-正方体-Html5Css3-遁地龙卷风

    (-1) 写在前面 我用的是chrome49,这个案例是从网上看到的,向这位同行致敬,建议大家在记录自己学习感悟时,向我一样加上笔名,被转载的时候还能留下点东西. 在研究slice-box.js的时候 ...

  8. linux常用命令-压缩解压命令

    gzip [文件] 压缩后文件格式 .gz,这个命令只能压缩文件,不能压缩目录.并且这个命令压缩后不保留源文件 gunzip [文件] 或者 gzip -d [文件] 解压缩.gz的压缩文件 tar ...

  9. Java的国际化(i18n)

    http://blog.csdn.net/csuliky/article/details/4225800 1. Java国际化简介 Java既然作为一个跨平台的语言就必然要在各种不同的语言环境中使用, ...

  10. 通过ip查询对方位置

    我们这里使用的是baidumap的高精度IP定位API的接口,具体说明可以参考baidu提供的文档 使用前需要申请一个AK密钥类似于Kgcx......................xxl8w的样式 ...