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 相关文章推荐
css把超出的部分显示为省略号的方法兼容火狐
Jul 23 Javascript
js 多浏览器分别判断代码
Apr 01 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
Jan 15 Javascript
js 调用父窗口的具体实现代码
Jul 15 Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
Jul 16 Javascript
js实现iGoogleDivDrag模块拖动层拖动特效的方法
Mar 04 Javascript
JS控制表格实现一条光线流动分割行的方法
Mar 09 Javascript
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
Jul 22 jQuery
Vue2.0如何发布项目实战
Jul 27 Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
Mar 28 Javascript
vue-cli整合vuex的时候,修改actions和mutations,实现热部署的方法
Sep 19 Javascript
VSCode 添加自定义注释的方法(附带红色警戒经典注释风格)
Aug 27 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
PHP实现网上点歌(二)
2006/10/09 PHP
php_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
php静态文件返回304技巧分享
2015/01/06 PHP
php 根据自增id创建唯一编号类
2017/04/06 PHP
php 使用html5 XHR2实现上传文件与进度显示功能示例
2020/03/03 PHP
关于二级域名下使用一级域名下的COOKIE的问题
2011/11/07 Javascript
js异常捕获方法介绍
2013/04/10 Javascript
动态的绑定事件addEventListener方法的使用
2014/01/24 Javascript
jquery表单验证插件(jquery.validate.js)的3种使用方式
2015/03/28 Javascript
jquery-tips悬浮提示插件分享
2015/07/31 Javascript
jQuery动画效果图片轮播特效
2016/01/12 Javascript
jquery validate表单验证插件
2016/09/06 Javascript
Jquery针对tr td的一些实用操作方法(必看篇)
2016/10/05 Javascript
纯JS实现只能输入数字的简单代码
2017/06/21 Javascript
详述 Sublime Text 打开 GBK 格式中文乱码的解决方法
2017/10/26 Javascript
Vue引入jquery实现平滑滚动到指定位置
2018/05/09 jQuery
新手快速上手webpack4打包工具的使用详解
2019/01/28 Javascript
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
2019/08/16 Javascript
浅析vue中的provide / inject 有什么用处
2019/11/10 Javascript
[51:15]2014 DOTA2国际邀请赛中国区预选赛 Orenda VS LGD-GAMING
2014/05/22 DOTA
[02:26]2018DOTA2亚洲邀请赛赛前采访-Newbee篇
2018/04/03 DOTA
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
Python实现的选择排序算法原理与用法实例分析
2017/11/22 Python
Python创建一个空的dataframe,并循环赋值的方法
2018/11/08 Python
对python制作自己的数据集实例讲解
2018/12/12 Python
PyQt5多线程刷新界面防假死示例
2019/12/13 Python
周仰杰(JIMMY CHOO)英国官方网站:闻名世界的鞋子品牌
2018/10/28 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
在购买印度民族服饰:Soch
2020/09/15 全球购物
使用索引有什么好处
2016/07/27 面试题
制定岗位职责的原则
2013/11/08 职场文书
新年抽奖获奖感言
2014/03/02 职场文书
读群众路线的心得体会
2014/09/03 职场文书
行为习惯主题班会
2015/08/14 职场文书
Redis全局ID生成器的实现
2022/06/05 Redis
Android Canvas绘制文字横纵向对齐
2022/06/05 Java/Android