JQuery数组详解（含实例）
<!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数组详解（含实例）的更多相关文章
- jQuery选择器详解及实例---《转载》
选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写 ...
- jQuery.validator 详解二
前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...
- jQuery.validator 详解
jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...
- 3.awk数组详解及企业实战案例
awk数组详解及企业实战案例 3.打印数组: [root@nfs-server test]# awk 'BEGIN{array[1]="zhurui";array[2]=" ...
- Protocol Buffer技术详解(C++实例)
Protocol Buffer技术详解(C++实例) 这篇Blog仍然是以Google的官方文档为主线,代码实例则完全取自于我们正在开发的一个Demo项目,通过前一段时间的尝试,感觉这种结合的方式比较 ...
- GLSL-几何着色器详解跟实例（GS：Geometry Shader）[转]
[OpenGL4.0]GLSL-几何着色器详解和实例(GS:Geometry Shader) 一.什么是几何着色器(GS:Geometry Shader) Input Assembler(IA)从顶点 ...
- CvMat、Mat、IplImage之间的转换详解及实例
见原博客:http://blog.sina.com.cn/s/blog_74a459380101obhm.html OpenCV学习之CvMat的用法详解及实例 CvMat是OpenCV比较基础的函数 ...
- (转)awk数组详解及企业实战案例
awk数组详解及企业实战案例 原文:http://www.cnblogs.com/hackerer/p/5365967.html#_label03.打印数组:1. [root@nfs-server t ...
- jQuery：详解jQuery中的事件（二）
上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...
随机推荐
- decimal与double，float的选择与区别
decimal 类型可以精确地表示非常大或非常精确的小数.大至 1028(正或负)以及有效位数多达 28 位的数字可以作为 decimal类型存储而不失其精确性.该类型对于必须避免舍入错误的应用程序( ...
- webapi-crud
- Service Provider Interface
@(Java)[SPI] Service Provider Interface API的一种设计方法,一般用于一些服务提供给第三方实现或者扩展,可以增强框架的扩展或者替换一些组件. 结构 Servic ...
- Mac下安装ionic和cordova,并生成iOS项目
为了开发HTML5,除了最新使用React Native等之外,目前首选的为稳定的ionic+Angularjs来开发iOS和android. Ionic(ionicframework一款接近原生的H ...
- JAVA之线程同步的三种方法
最近接触到一个图片加载的项目,其中有声明到的线程池等资源需要在系统中线程共享,所以就去研究了一下线程同步的知识,总结了三种常用的线程同步的方法,特来与大家分享一下.这三种方法分别是:synchroni ...
- 【学习笔记】Struts2之配置文件struts.xml
在默认情况下,Struts2只自动加载类加载路径下的struts.xml.default-struts.xml和struts-plugin.xml三类文件.但是随着应用规模的增大,系统中Action数 ...
- 防御CSRF的方法有哪些（一） HTTP 头中自定义属性并验证 CSRF跨站域请求伪造攻击
CSRF (Cross Site Request Forgery, 跨站域请求伪造)是一种网络的攻击方式,该攻击可以在受害者毫不知情的情况下以受害者名义伪造请求发送给受攻击站点,从而在并未授权的情况下 ...
- Greenplum-概念篇
Greenplum主要组件包括:Master.Segments.Interconnect:其他组件包括ETL Server.Greenplum command center等.0. 组件之-Maste ...
- 博客整理——K米测评
K米测评 1.233郑扬涛(orzyt) 博客链接:个人作业--关于K米的产品案例分析 亮点分析: 1.将整个软件各个功能模块的逻辑图都画出来了,而不是只画一个大概. 我做了个缩略图 2.第三部分 建 ...
- vue.js的一些知识点
1. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...