Home » jQuery » $.each()

$.each()

译自官方手冊:jQuery.each()

对数组或对对象内容进行循环处理

jQuery.each( collection, callback(indexInArray, valueOfElement) )

collection   遍历的对象或数组

callback(indexInArray, valueOfElement) 在每个对象上调用的函数

说明

一个通用的遍历函数 , 能够用来遍历对象和数组. 数组和含有一个length属性的伪数组对象 (伪数组对象如function的arguments对象)以数字索引进行遍历,从0到length-1, 其他的对象通过的属性进行遍历.

$.each()与$(selector).each()不同, 后者专用于jquery对象的遍历, 前者可用于遍历不论什么的集合(不管是数组或对象),假设是数组,回调函数每次传入数组的索引和相应的值(值亦能够通过this keyword获取,但javascript总会包装this 值作为一个对象—虽然是一个字符串或是一个数字),方法会返回被遍历对象的第一參数

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

//样例:———传入数组

<!DOCTYPE html>

<html>

<head>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<script>

$.each([52, 97], function(index, value) {

alert(index + ‘: ‘ + value);

});

</script>

</body>

</html>

//输出

0: 52

1: 97

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

//样例:———假设一个映射作为集合使用,回调函数每次传入一个键-值对

<!DOCTYPE html>

<html>

<head>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<script>

var map = {

‘flammable’: ‘inflammable’,

‘duh’: ‘no duh’

};

$.each(map, function(key, value) {

alert(key + ‘: ‘ + value);

});

</script>

</body>

</html>

//输出

flammable: inflammable

duh: no duh

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

//样例:———回调函数中 return false时能够退出$.each(), 假设返回一个非false 即会像在for循环中使用continue 一样, 会马上进入下一个遍历

<!DOCTYPE html>

<html>

<head>

<style>

div { color:blue; }

div#five { color:red; }

</style>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<div id=”one”></div>

<div id=”two”></div>

<div id=”three”></div>

<div id=”four”></div>

<div id=”five”></div>

<script>

var arr = [ "one", "two", "three", "four", "five" ];//数组

var obj = { one:1, two:2, three:3, four:4, five:5 }; // 对象

jQuery.each(arr, function() {  // this 指定值

$(“#” + this).text(“Mine is ” + this + “.”);  // this指向为数组的值, 如one, two

return (this != “three”); // 假设this = three 则退出遍历

});

jQuery.each(obj, function(i, val) {  // i 指向键, val指定值

$(“#” + i).append(document.createTextNode(” – ” + val));

});

</script>

</body>

</html>

// 输出

Mine is one. – 1
Mine is two. – 2
Mine is three. – 3
- 4
- 5
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

//样例:———遍历数组的项, 传入index和value

<!DOCTYPE html>

<html>

<head>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<script>

$.each( ['a','b','c'], function(i, l){

alert( “Index #” + i + “: ” + l );

});

</script>

</body>

</html>

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

//样例:———遍历对象的属性,传入 key和value

<!DOCTYPE html>

<html>

<head>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<script>

$.each( { name: “John”, lang: “JS” }, function(k, v){

alert( “Key: ” + k + “, Value: ” + v );

});

</script>

</body>

</html>

正自评论的样例:

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

1. 假设不想输出第一项 (使用retrun true)进入 下一遍历

<!DOCTYPE html>

<html>

<head>

<script src=”http://code.jquery.com/jquery-latest.js”></script>

</head>

<body>

<script>

var myArray=["skipThis", "dothis", "andThis"];

$.each(myArray, function(index, value) {

if (index == 0) {

return true; // equivalent to ‘continue’ with a normal for loop

}

// else do stuff…

alert (index + “: “+ value);

});

</script>

</body>

</html>

随机推荐

  1. Objective－C 笔记二 类、对象和方法

    对象就是一个物件.面向对象的程序设计可以看成一个物件和你想对它做的事情.这与C语言不同,C语言通常称为过程性语言.在C语言中,通常是先考虑要做什么,然后才关注对象,这几乎总是与面相对象的思考过程相反. ...

  2. cas sso单点登录系列2:cas客户端和cas服务端交互原理动画图解，cas协议终极分析

    转:http://blog.csdn.net/ae6623/article/details/8848107 1)PPT流程图:ppt下载:http://pan.baidu.com/s/1o7KIlom ...

  3. cas sso入门（转）

    转:http://blog.csdn.net/frinder/article/details/7969925 一.教程说明 前言 教程目的:从头到尾细细道来单点登录服务器及客户端应用的每个步骤 单点登 ...

  4. Qt零基础教程(四) QWidget详解篇

    在博客园里面转载我自己写的关于Qt的基础教程,没次写一篇我会在这里更新一下目录: Qt零基础教程(四) QWidget详解(1):创建一个窗口 Qt零基础教程(四) QWidget详解(2):QWid ...

  5. JavaScript-学习一全局变量

    因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量. 局部变量在函数开始执行时创建,函数执行完后局部变量会自动销 不限制位置的 JavaScript 变量生命周期在它声明时初始化. 局部 ...

  6. jvectormap 中国地图 (包括香港、台湾、澳门)

    一个完整的中国地图(各个省,市.还有国两制),谢谢大家. 忘了网上哪位的范例,我加了些修改. <html xmlns="http://www.w3.org/1999/xhtml&quo ...

  7. day06

    一.configparser模块 configparser用于处理特定格式的文件,其本质上是利用open来操作文件 1.获取所有节点 import configparser config = conf ...

  8. sort对二维字符数组排序（转）

    由于二维字符数组的第二维没有赋值运算符,即不能对整个一维数组进行赋值,因此是无法直接对二维数组用sort进行排序的,解决办法有二种: 代码一: #include <iostream> #i ...

  9. iOS页面间传值的方式 （Delegate/NSNotification/Block/NSUserDefault/单例）

    iOS页面间传值的方式(Delegate/NSNotification/Block/NSUserDefault/单例)   iOS页面间传值的方式(NSUserDefault/Delegate/NSN ...

  10. 最近国外很拉风的,,基于.net 的一个手表

    site:http://agentwatches.com/ 这个项目是一个国外工作室,筹集资金 创立的. 直接用c# 代码编译显示在手机上.能和智能手机通信等. 并且是开源的. 很酷 其次.它提供了. ...