jQuery.each(object, [callback])

通用例遍方法,可用于例遍对象和数组。

不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。

例遍数组,同时使用元素索引和内容。

jQuery 代码:
$.each( [0,1,2], function(i, n){
alert( "Item #" + i + ": " + n );
});

描述:

例遍对象,同时使用成员名称和变量内容。

jQuery 代码:
$.each( { name: "John", lang: "JS" }, function(i, n){
alert( "Name: " + i + ", Value: " + n );
});

---------------------------

$().each(callback)

以每一个匹配的元素作为上下文来执行一个函数。

意味着,每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素)。而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。 返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。

HTML 代码:
<img/><img/>
jQuery 代码:
$("img").each(function(i){
this.src = "test" + i + ".jpg";
});
结果:
[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]

描述:

如果你想得到 jQuery对象,可以使用 $(this) 函数。

HTML 代码:
<button>Change colors</button>
<span></span>
<div></div>
<div></div> <div></div>
<div></div>
<div id="stop">Stop here</div>
<div></div> <div></div>
<div></div>
jQuery 代码:
$("img").each(function(){
$(this).toggleClass("example");
});

描述:

你可以使用 'return' 来提前跳出 each() 循环。

HTML 代码:
<button>Change colors</button>
<span></span>
<div></div>
<div></div> <div></div>
<div></div>
<div id="stop">Stop here</div>
<div></div> <div></div>
<div></div>
jQuery 代码:
$("button").click(function () {
$("div").each(function (index, domEle) {
// domEle == this
$(domEle).css("backgroundColor", "yellow");
if ($(this).is("#stop")) {
$("span").text("Stopped at div index #" + index);
return false;
}
});
});

jQuery.each(object, [callback])数组对象操作--jQuery 对象访问 $().each(callback)的更多相关文章

  1. JQuery制作网页—— 第二章 JavaScript操作BOM对象

    1.window对象: 浏览器对象模型(BOM)是javascript的组成之一, 它提供了独立与浏览器窗口进行交换的对象,使用浏览器对象模型可以实现与HTML的交互. 它的作用是将相关的元素组织包装 ...

  2. jQuery基础教程-第8章-002Adding jQuery object methods

    一.Object method context 1.We have seen that adding global functions requires extending the jQuery ob ...

  3. 原生JS中常用的Window和DOM对象操作汇总

    一.常用的Window对象操作 Window对象中又包含了document.history.location.Navigator和screen几个对象,每个对象又有自己的属性方法,这里window可以 ...

  4. js,jQuery数组常用操作小结

    一.js中数组常用操作小结 (1) shift:删除原数组第一项,并返回删除元素的值:如果数组为空则返回undefined var a = [1,2,3,4,5]; var b = a.shift() ...

  5. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  6. js/jquery 操作document对象

    一.获取对象 //js获取的是dom对象,jquery获取的是jquery对象 //jquery对象可以输出dom对象,索引方式输出dom对象,eq()[]方式输出dom对象;eq()输出jquery ...

  7. jQuery(九)、ajax对象操作

    1 数组和对象操作 1.jQuery.extend([deep,] target, object1, [objectN]) 用一个或多个其他对象来扩展一个对象,返回被扩展的对象. 如果不指定targe ...

  8. 前端笔记之jQuery(上)加载函数的区别&对象&操作HTML/CSS&动画&选择器

    一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...

  9. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

随机推荐

  1. C# 共享内存(转)

    以下是一个C#操作内存的一个类,只要将下面的类添加到相应的项目中,该项目就可以对内存进行直接操作! using System.Runtime.InteropServices;    //添加如下命名空 ...

  2. python selenium --browser 操作

    本节知识点: 打印URL 将浏览器最大化 设置浏览器固定宽.高 操控浏览器前进.后退 打印URL 上一节讲到,可以将浏览器的title打印出来,这里再讲个简单的,把当前URL打印出来.其实也没啥大用, ...

  3. hadoop2.7.0实践- WordCount

    环境要求 说明:本文档为wordcount的mapreduce job编写及执行文档. 操作系统:Ubuntu14 x64位 Hadoop:Hadoop 2.7.0 Hadoop官网:http://h ...

  4. js返回页面顶部

    第一次写博客,不太专业,废话不多说,直接上自己早上做的东东.有不足之处,希望指点. css: body{counter-reset: p;} p{width: 100px;margin: 20px 0 ...

  5. .Net并行编程高级教程(二)-- 任务并行

    前面一篇提到例子都是数据并行,但这并不是并行化的唯一形式,在.Net4之前,必须要创建多个线程或者线程池来利用多核技术.现在只需要使用新的Task实例就可以通过更简单的代码解决命令式任务并行问题. 1 ...

  6. 点滴积累【JS】---JS小功能(offsetLeft实现图片滚动效果)

    效果: 代码: <head runat="server"> <title></title> <style type="text/ ...

  7. NGUI中获取鼠标在控件内部坐标

    在UIWidget 中添加以下函数.获得的坐标系是以右上角为原点坐标,x轴向左,一轴向下. public Vector2 GetTouchPoint() { Vector3 p0 =  cachedT ...

  8. Atitit.h5 web webview性能提升解决方案-----fileStrore缓存离线存储+http方案

    Atitit.h5 web webview性能提升解决方案-----fileStrore缓存离线存储+http方案 1. 业务场景 android+webview h5 css背景图性能提升1 2. ...

  9. c++的set_unexpected不起作用

    代码是从:http://www.cplusplus.com/referen ... /?kw=set_unexpected找的 // set_unexpected example #include & ...

  10. C预编译宏

    /* ============================================================================ Name : c_test001.c A ...