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 html页面倒计时可精确到秒
Oct 22 Javascript
JavaScript代码复用模式详解
Nov 07 Javascript
JQuery移动页面开发之屏幕方向改变与滚屏的实现
Dec 03 Javascript
分享使用AngularJS创建应用的5个框架
Dec 05 Javascript
JS组件Bootstrap Table表格行拖拽效果实现代码
Aug 27 Javascript
php输出全部gb2312编码内的汉字方法
Mar 04 Javascript
详解Node中导入模块require和import的区别
Aug 11 Javascript
使用react-router4.0实现重定向和404功能的方法
Aug 28 Javascript
Bootstrap一款超好用的前端框架
Sep 25 Javascript
从0到1构建vueSSR项目之node以及vue-cli3的配置
Mar 07 Javascript
浅谈js中的bind
Mar 18 Javascript
Node.js事件的正确使用方法
Apr 05 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
在字符串中把网址改成超级链接
2006/10/09 PHP
一些常用的php简单命令代码集锦
2007/09/24 PHP
PHP判断变量是否为0的方法
2014/02/08 PHP
php中隐形字符65279(utf-8的BOM头)问题
2014/08/16 PHP
程序员的表白神器“520”大声喊出来
2016/05/20 PHP
Yii安装与使用Excel扩展的方法
2016/07/13 PHP
Javascript Cookie读写删除操作的函数
2010/03/02 Javascript
js跨域问题之跨域iframe自适应大小实现代码
2010/07/17 Javascript
使用jquery.qrcode生成彩色二维码实例
2014/08/08 Javascript
js实现仿百度风云榜可重复多次调用的TAB切换选项卡效果
2015/08/31 Javascript
JS实现可点击展开与关闭的左侧广告代码
2015/09/02 Javascript
基于javascript如何传递特殊字符
2015/11/30 Javascript
属于你的jQuery提示框(Tip)插件
2016/01/20 Javascript
Bootstrap3学习笔记(三)之表格
2016/05/20 Javascript
基于JS实现9种不同的面包屑和分布式多步骤导航效果
2017/02/21 Javascript
从零学习node.js之mysql数据库的操作(五)
2017/02/24 Javascript
React学习笔记之条件渲染(一)
2017/07/02 Javascript
JS实现手写parseInt的方法示例
2017/09/24 Javascript
解决linux下node.js全局模块找不到的问题
2018/05/15 Javascript
Angular实现模版驱动表单的自定义校验功能(密码确认为例)
2018/05/17 Javascript
Iview Table组件中各种组件扩展的使用
2018/10/20 Javascript
Vue列表渲染的示例代码
2018/11/01 Javascript
Vue中的循环及修改差值表达式的方法
2019/08/29 Javascript
nuxt.js服务端渲染中axios和proxy代理的配置操作
2020/11/06 Javascript
深入理解Python中的内置常量
2017/05/20 Python
pyQT5 实现窗体之间传值的示例
2019/06/20 Python
Python 异常处理Ⅳ过程图解
2019/10/18 Python
Django Xadmin多对多字段过滤实例
2020/04/07 Python
2014年安全生产大检查方案
2014/05/13 职场文书
法学求职信
2014/06/22 职场文书
党员批评与自我批评发言
2014/10/02 职场文书
个人工作总结(管理人员)范文
2019/08/13 职场文书
导游词之沈阳植物园
2019/11/30 职场文书
MySQL 如何设计统计数据表
2021/06/15 MySQL
PostgreSQL常用字符串分割函数整理汇总
2022/07/07 PostgreSQL