jQuery数组处理方法汇总


Posted in Javascript onJune 20, 2011

$.each(array, [callback])遍历,很常用

var arr = ['javascript', 'php', 'java', 'c++', 'c#', 'perl', 'vb', 'html', 'css', 'objective-c']; 
$.each(arr, function(key, val) { 
// firebug console 
console.log('index in arr:' + key + ", corresponding value:" + val); 
// 如果想退出循环 
// return false; 
});

$.grep(array, callback, [invert])过滤,常用
var temp = []; 
temp = $.grep(arr, function(val, key) { 
if(val.indexOf('c') != -1) 
return true; 
// 如果[invert]参数不给或为false, $.grep只收集回调函数返回true的数组元素 
// 反之[invert]参数为true, $.grep收集回调函数返回false的数组元素 
}, false); 
console.dir(temp);

$.map(array, [callback])用的不是太多
//1.6之前的版本只支持数组 
temp = $.map(arr, function(val, key) { 
//返回null,返回的数组长度减1 
if(val === 'vb') return null; 
return val; 
}); 
console.dir(temp); 
//1.6开始支持json格式的object 
var obj = {key1: 'val1', key2: 'val2', key3: 'val3'}; 
temp = $.map(obj, function(val, key) { 
return val; 
}); 
console.dir(temp);

$.inArray(val, array)判断是否在指定数组中,常用
//返回元素在数组中的位置,0为起始位置,返回-1则未找到该元素 
console.log($.inArray('javascript', arr));

$.merge(first, second)合并两个数组,使用频率一般
var frontEnd = ['javascript', 'css', 'html'], 
backEnd = ['java', 'php', 'c++']; 
// 这种方式会修改第一个参数, 即frontEnd数组 
temp = $.merge(frontEnd, backEnd); 
console.dir(temp); 
console.dir(frontEnd); 
// 可以用下面的方式来避免对原数组的影响 
// $.merge($.merge([], frontEnd), backEnd);

$.unique(array)过滤数组中的重复元素,不常用
<DIV>blahblahblah....</DIV> 
<DIV></DIV> 
<DIV class=dup></DIV> 
<DIV class=dup></DIV> 
<DIV class=dup></DIV> 
<DIV></DIV> 
// $.unique只支持DOM元素数组,去除重复DOM元素,不支持其他类型数组(String或者Number) 
// 获得原始的DOM数组,而不是jQuery封装的 
var divs = $('div').get(); 
// 增加几个class为dup的div 
divs = divs.concat($('div.dup').get()); 
console.log("before unique:" + divs.length); 
divs = $.unique(divs); 
console.log("after unique:" + divs.length);

$.makeArray(obj)将类数组对象转成数组,不常用
//首先什么是类数组对象?jQuery官网上用divs = getElementsByTag('div')来做例子 
//这个divs有类似数组的一些方法比如length,通过[index]方式获取元素等 
//然后通过$.makeArray(divs)使它转为数组,就可以用数组的其他功能 
//比如reverse(), pop()等

$(dom).toArray()将jQuery集合恢复成DOM数组,不常用
 
//跟makeArray一样,相当的不常用,一般情况可以忽略
本文参考Mr.Think的blog,在此感谢分享
Javascript 相关文章推荐
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 Javascript
js页面跳转常用的几种方式
Nov 25 Javascript
JavaScript下通过的XMLHttpRequest发送请求的代码
Jun 28 Javascript
jQuery的缓存机制浅析
Jun 07 Javascript
javascript实现的元素拖动函数宿主为浏览器
Jul 21 Javascript
js实现随机点名小功能
Aug 17 Javascript
node.js中http模块和url模块的简单介绍
Oct 06 Javascript
在vue中使用Autoprefixed的方法
Jul 27 Javascript
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
Sep 27 Javascript
vue给组件传递不同的值方法
Sep 29 Javascript
Angular8基础应用之表单及其验证
Aug 11 Javascript
微信小程序顶部导航栏可滑动并选中放大
Dec 05 Javascript
jQuery UI AutoComplete 使用说明
Jun 20 #Javascript
jQuery 源码分析笔记(3) Deferred机制
Jun 19 #Javascript
jQuery 源码分析笔记(7) Queue
Jun 19 #Javascript
jQuery 源码分析笔记(5) jQuery.support
Jun 19 #Javascript
jQuery调用WebService的实现代码
Jun 19 #Javascript
非常棒的10款jQuery 幻灯片插件
Jun 14 #Javascript
在jquery中处理带有命名空间的XML数据
Jun 13 #Javascript
You might like
PHP无限分类代码,支持数组格式化、直接输出菜单两种方式
2011/05/18 PHP
php中OR与|| AND与&amp;&amp;的区别总结
2013/10/26 PHP
php将access数据库转换到mysql数据库的方法
2014/12/24 PHP
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
2007/03/06 Javascript
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
2010/03/21 Javascript
Javascript中的isNaN函数使用说明
2011/11/10 Javascript
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
2012/08/14 Javascript
jquery实现简单实用的弹出层效果代码
2015/10/15 Javascript
javascript和jquery实现用户登录验证
2016/05/04 Javascript
20分钟成功编写bootstrap响应式页面 就这么简单
2016/05/12 Javascript
JS去除空格和换行的正则表达式(推荐)
2016/06/14 Javascript
D3.js实现文本的换行详解
2016/10/14 Javascript
Bootstrap CSS组件之导航(nav)
2016/12/17 Javascript
js实现弹窗暗层效果
2017/01/16 Javascript
浅析JavaScript中var that=this
2017/02/17 Javascript
vue2.0 axios跨域并渲染的问题解决方法
2018/03/08 Javascript
JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】
2018/03/15 Javascript
快速搭建vue2.0+boostrap项目的方法
2018/04/09 Javascript
如何使node也支持从url加载一个module详解
2018/06/05 Javascript
Vue引入sass并配置全局变量的方法
2018/06/27 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
2018/09/04 Javascript
python实现自动登录人人网并访问最近来访者实例
2014/09/26 Python
解决tensorflow测试模型时NotFoundError错误的问题
2018/07/27 Python
Python数据可视化:饼状图的实例讲解
2019/12/07 Python
Python 音频生成器的实现示例
2019/12/24 Python
python 非线性规划方式(scipy.optimize.minimize)
2020/02/11 Python
python报错: 'list' object has no attribute 'shape'的解决
2020/07/15 Python
8种常用的Python工具
2020/08/05 Python
Python Selenium自动化获取页面信息的方法
2020/08/31 Python
把Anaconda中的环境导入到Pycharm里面的方法步骤
2020/10/30 Python
利用HTML5+css3+jquery+weui实现仿微信聊天界面功能
2018/01/08 HTML / CSS
办理退休介绍信
2014/01/09 职场文书
关于诚信的活动方案
2014/08/18 职场文书
2014年工作总结与下年工作计划
2014/11/27 职场文书
2015中秋节晚会开场白
2015/07/30 职场文书
严以用权学习心得体会
2016/01/12 职场文书