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 相关文章推荐
JavaScript 节点操作 以及DOMDocument属性和方法
Dec 06 Javascript
IE JS编程需注意的内存释放问题
Jun 23 Javascript
textarea中的手动换行处理的jquery代码
Feb 26 Javascript
JQuery中html()方法使用不当带来的陷阱
Apr 07 Javascript
JQuery获取文本框中字符长度的代码
Sep 29 Javascript
Textarea根据内容自适应高度
Oct 28 Javascript
jquery用offset()方法获得元素的xy坐标
Sep 06 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
Aug 29 Javascript
实例解析jQuery中如何取消后续执行内容
Dec 01 Javascript
为vue-router懒加载时下载js的过程中添加loading提示避免无响应问题
Apr 03 Javascript
Laravel admin实现消息提醒、播放音频功能
Jul 10 Javascript
Vue实现购物车基本功能
Nov 08 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
第三节 定义一个类 [3]
2006/10/09 PHP
PHP采集腾讯微博的实现代码
2012/01/19 PHP
PHP 利用AJAX获取网页并输出的实现代码(Zjmainstay)
2012/08/31 PHP
PHP高手需要要掌握的知识点
2014/08/21 PHP
php算法实例分享
2015/07/14 PHP
基于jquery的地址栏射击游戏代码
2011/03/10 Javascript
jQuery替换textarea中换行的方法
2015/06/10 Javascript
js实现仿百度风云榜可重复多次调用的TAB切换选项卡效果
2015/08/31 Javascript
分享纯手写漂亮的表单验证
2015/11/19 Javascript
JavaScript中Textarea滚动条不能拖动的解决方法
2015/12/15 Javascript
jQuery插件dataTables添加序号列的方法
2016/07/06 Javascript
详解Angular 4 表单快速入门
2017/06/05 Javascript
详解从零搭建 vue2 vue-router2 webpack3 工程
2017/11/22 Javascript
详解开发react应用最好用的脚手架 create-react-app
2018/04/24 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
2018/09/01 Javascript
vue项目中运用webpack动态配置打包多种环境域名的方法
2019/06/24 Javascript
关于layui 弹出层一闪而过就消失的解决方法
2019/09/09 Javascript
java和js实现的洗牌小程序
2019/09/30 Javascript
vue 实现路由跳转时更改页面title
2019/11/05 Javascript
react结合bootstrap实现评论功能
2020/05/30 Javascript
vue 如何使用递归组件
2020/10/23 Javascript
[01:20]DOTA2 齐天大圣至宝动态展示
2016/12/13 DOTA
[02:52]2017DOTA2国际邀请赛中国区预选赛晋级之路
2017/07/03 DOTA
[53:52]OG vs EG 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
win10环境下python3.5安装步骤图文教程
2017/02/03 Python
python获取服务器响应cookie的实例
2018/12/28 Python
python itchat给指定联系人发消息的方法
2019/06/11 Python
Html5与App的通讯方式详解
2019/10/24 HTML / CSS
html5视频自动横过来自适应页面且点击播放功能的实现
2020/06/03 HTML / CSS
介绍Java的内部类
2012/10/27 面试题
哪些情况下不应该使用索引
2015/07/20 面试题
初中生学习的自我评价
2013/11/14 职场文书
毕业生对母校寄语
2015/02/26 职场文书
2015年全国保险公众宣传日活动方案
2015/05/06 职场文书
2015年会计工作总结范文
2015/05/26 职场文书
公司与个人合作协议书
2016/03/19 职场文书