$.each()

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

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

collection 遍历的对象或数组；

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

说明

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

$.each()与$(selector).each()不同, 后者专用于jquery对象的遍历, 前者可用于遍历任何的集合(无论是数组或对象),如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但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>

</head>

<body>

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>

随机推荐

MySQL配置文件my.cnf中文详解附mysql性能优化方法分享
Mysql参数优化对于新手来讲,是比较难懂的东西,其实这个参数优化,是个很复杂的东西,对于不同的网站,及其在线量,访问量,帖子数量,网络情况,以及机器硬件配置都有关系,优化不可能一次性完成,需要不断的 ...
360随身WIFI程序单文件绿色版及网卡驱动（附使用感受）
大家好,我是Colin,今天刚收到传说中的360WIFI,拿到手后马上就进行了测试.就做工而言,19.9的价格算是比较公道的,网卡很小,做工还可以,带磨砂质感,而且还提供了一个耳机插头,可以当挂件一样 ...
resin
http://blog.csdn.net/sea0x/article/details/6097531 resin 启动: resin 配置文件摘取: <server-default> &l ...
学习（主题或切入点）checklist1
业务+技术+架构+运维+管理技术学习:http://www.runoob.com/mongodb/mongodb-query.html 一.技术篇补充学习列表 1,mongodb(o) 2,red ...
POJ 2486 Apple Tree
好抽象的树形DP......... Apple Tree Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 6411 Accepte ...
部分LINUX系统由图形界面启动变更为命令行界面启动的方法
背景: 图形界面很绚丽,但是现在并不需要图形界面,只需要命令行即可,所以要将图形界面自启动给关闭. 正文: Centos: 更改文件/etc/inittab的其中一行 id:5 ...
Mysql InnoDB行锁实现方式
Mysql InnoDB行锁实现方式 InnoDB行锁是通过给索引上的索引项加锁来实现的,这一点MySQL与Oracle不同,后者是通过在数据块中对相应数据行加锁来实现的.InnoDB这种行锁实现特点 ...
【python网络编程】新浪爬虫：关键词搜索爬取微博数据
上学期参加了一个大数据比赛,需要抓取大量数据,于是我从新浪微博下手,本来准备使用新浪的API的,无奈新浪并没有开放关键字搜索的API,所以只能用爬虫来获取了.幸运的是,新浪提供了一个高级搜索功能,为我 ...
git之remote branch controller（远程分支控制）
1.创建本地分支 git branch //查看远程分支 git checkout -b branch_name //创建远程分支在查看分支git branch 2.将分支提交到远程仓库此时远程 ...
Java多线程基础知识（三）
一. 管道输入/输出流它和其它文件输入/输出流或网络输入/输出流的不同之处,它主要是线程之间的数据传输,而传输的媒介是内存. 管道输入/输出流主要包含四中实现: 1. PipedOutputStre ...

$.each 和$(selector).each()的区别

$.each()

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

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

随机推荐

热门专题