jquery each的几种常用的使用方法示例


Posted in Javascript onJanuary 21, 2014

jQuery源码里自己也有很多用到each方法。其实jQuery里的each方法是通过js里的call方法来实现的。下面简单介绍一下call方法。

call这个方法很奇妙,其实官方的说明是:“调用一个对象的一个方法,以另一个对象替换当前对象。”网上更多的解释是变换上下文环境,也有说是改变上下文this指针。

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

参数

thisObj  可选项。将被用作当前对象的对象。
arg1, arg2,  , argN  可选项。将被传递方法参数序列。

call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

例子

function add(a,b)   
{   
    alert(a+b);   
}   
function sub(a,b)   
{   
    alert(a-b);   
}   
add.call(sub,3,1); 

用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4);
注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。
具体call更深入的就不在这里提了。

下面提一下jQuery的each方法的几种常用的用法

 var arr = [ "one", "two", "three", "four"];     
 $.each(arr, function(){     
    alert(this);     
 });  
 

上面这个each输出的结果分别为:one,two,three,four
var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]     
$.each(arr1, function(i, item){     
   alert(item[0]);     
}); 

其实arr1为一个二维数组,item相当于取每一个一维数组,  
item[0]相对于取每一个一维数组里的第一个值  
所以上面这个each输出分别为:1   4   7    

var obj = { one:1, two:2, three:3, four:4};     
$.each(obj, function(key, val) {     
    alert(obj[key]);           
});  

这个each就有更厉害了,能循环每一个属性    
输出结果为:1   2  3  4

Javascript 相关文章推荐
js简单实现点击左右运动的方法
Apr 10 Javascript
jQuery实现放大镜效果实例代码
Mar 17 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
Dec 02 Javascript
微信小程序学习(4)-系统配置app.json详解
Jan 12 Javascript
DOM事件探秘篇
Feb 15 Javascript
详解数组Array.sort()排序的方法
May 09 Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
May 02 Javascript
详解angular2 控制视图的封装模式
Dec 27 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
微信小程序 扭蛋抽奖机css3动画实现详解
Jul 19 Javascript
vue列表数据发生变化指令没有更新问题及解决方法
Jan 16 Javascript
解决VUE-Router 同一页面第二次进入不刷新的问题
Jul 22 Javascript
JavaScript在for循环中绑定事件解决事件参数不同的情况
Jan 20 #Javascript
javascript break指定标签打破多层循环示例
Jan 20 #Javascript
js点击出现悬浮窗效果不使用JQuery插件
Jan 20 #Javascript
javascript中直接引用Microsoft的COM生成Word
Jan 20 #Javascript
通过复制Table生成word和excel的javascript代码
Jan 20 #Javascript
js取值中form.all和不加all的区别介绍
Jan 20 #Javascript
如何实现textarea里的不同文本显示不同颜色
Jan 20 #Javascript
You might like
全国FM电台频率大全 - 30 宁夏回族自治区
2020/03/11 无线电
PHP基于CURL进行POST数据上传实例
2014/11/10 PHP
培养自己的php编码规范
2015/09/28 PHP
PHP常见漏洞攻击分析
2016/02/21 PHP
基于jquery的复制网页内容到WORD的实现代码
2011/02/16 Javascript
基于jquery实现漂亮的动态信息提示效果
2011/08/02 Javascript
jQuery中Dom的基本操作小结
2014/01/23 Javascript
js实现日期级联效果
2014/01/23 Javascript
简单谈谈javascript代码复用模式
2015/01/28 Javascript
jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法
2015/03/24 Javascript
AngularJS通过$location获取及改变当前页面的URL
2016/09/23 Javascript
AngularJS 在同一个界面启动多个ng-app应用模块详解
2016/12/20 Javascript
JavaScript字符串对象(string)基本用法示例
2017/01/18 Javascript
利用js定义一个导航条菜单
2017/03/14 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
2017/12/16 Javascript
Angular4.0中引入laydate.js日期插件的方法教程
2017/12/25 Javascript
node链接mongodb数据库的方法详解【阿里云服务器环境ubuntu】
2019/03/07 Javascript
转换layUI的数据表格中的日期格式方法
2019/09/19 Javascript
jQuery--遍历操作实例小结【后代、同胞及过滤】
2020/05/22 jQuery
Vue使用axios引起的后台session不同操作
2020/08/14 Javascript
vue3为什么要用proxy替代defineProperty
2020/10/19 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
2021/03/01 Javascript
Python实现从订阅源下载图片的方法
2015/03/11 Python
python批量生成本地ip地址的方法
2015/03/23 Python
python matplotlib绘图,修改坐标轴刻度为文字的实例
2018/05/25 Python
Pycharm更换python解释器的方法
2018/10/29 Python
Python中利用aiohttp制作异步爬虫及简单应用
2018/11/29 Python
Django model反向关联名称的方法
2018/12/15 Python
Django微信小程序后台开发教程的实现
2020/06/03 Python
详解Python IO口多路复用
2020/06/17 Python
css3 线性渐变和径向渐变示例附图
2014/04/08 HTML / CSS
进程的查看和调度分别使用什么命令
2015/03/25 面试题
大学生职业生涯规划范文
2013/12/31 职场文书
讲文明树新风公益广告宣传方案
2014/02/25 职场文书
人事专员的职责
2014/02/26 职场文书
2015年国庆节慰问信
2015/03/23 职场文书