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 相关文章推荐
JMenuTab简单使用说明
Mar 13 Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
Aug 28 Javascript
javaScript arguments 对象使用介绍
Oct 18 Javascript
JS中call/apply、arguments、undefined/null方法详解
Feb 15 Javascript
浅谈json取值(对象和数组)
Jun 24 Javascript
jQuery实现三级联动效果
Mar 02 Javascript
创建简单的node服务器实例(分享)
Jun 23 Javascript
jQuery EasyUI开发技巧总结
Sep 26 jQuery
浅谈Angular7 项目开发总结
Dec 19 Javascript
9102了,你还不会移动端真机调试吗
Mar 25 Javascript
JavaScript观察者模式原理与用法实例详解
Mar 10 Javascript
原生JS运动实现轮播图
Jan 02 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
DC的38部超级英雄动画电影
2020/03/03 欧美动漫
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
解决jquery操作checkbox火狐下第二次无法勾选问题
2014/02/10 Javascript
window.open()详解及浏览器兼容性问题示例探讨
2014/05/29 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
2015/12/15 Javascript
javascript类型系统 Array对象学习笔记
2016/01/09 Javascript
jQuery使用中可能被XSS攻击的一些危险环节提醒
2016/05/24 Javascript
JS如何判断json是否为空
2016/07/06 Javascript
JavaScript递归操作实例浅析
2016/10/31 Javascript
JS实现的点击表头排序功能示例
2017/03/27 Javascript
echart简介_动力节点Java学院整理
2017/08/11 Javascript
React-intl 实现多语言的示例代码
2017/11/03 Javascript
JQuery扩展对象方法操作示例
2018/08/21 jQuery
vue中子组件的methods中获取到props中的值方法
2018/08/27 Javascript
Vue解析带html标签的字符串为dom的实例
2019/11/13 Javascript
通过vue.extend实现消息提示弹框的方法记录
2021/01/07 Vue.js
[01:00:13]完美世界DOTA2联赛 LBZS vs Forest 第一场 11.07
2020/11/09 DOTA
解决pyqt中ui编译成窗体.py中文乱码的问题
2016/12/23 Python
Python字符串格式化的方法(两种)
2017/09/19 Python
详解pyqt5 动画在QThread线程中无法运行问题
2018/05/05 Python
python3下使用cv2.imwrite存储带有中文路径图片的方法
2018/05/10 Python
Selenium启动Chrome时配置选项详解
2020/03/18 Python
HTML5 Web Database 数据库的SQL语句的使用方法
2012/12/09 HTML / CSS
Reformation官网:美国女装品牌
2018/09/14 全球购物
什么是典型的软件三层结构?软件设计为什么要分层?软件分层有什么好处?
2012/03/14 面试题
数控专业毕业生求职信范文
2013/09/21 职场文书
生日礼品店创业计划书范文
2014/03/21 职场文书
禁烟标语大全
2014/06/11 职场文书
班级团队活动方案
2014/08/14 职场文书
幼儿园工作总结2015
2015/04/01 职场文书
工伤劳动仲裁代理词
2015/05/25 职场文书
贷款工资证明范本
2015/06/12 职场文书
幼儿园教师读书笔记
2015/06/29 职场文书
会计岗位工作总结
2015/08/12 职场文书
毕业欢送晚会主持词
2019/06/25 职场文书
pyqt5蒙版遮罩mask,setmask的使用
2021/06/11 Python