jQuery 的 each 方法，作为一个通用遍历方法，可用于遍历对象和数组。
语法为：
jQuery.each(object, [callback])
回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。
// 遍历数组
$.each( [0,1,2], function(i, n){
console.log( "Item #" + i + ": " + n );
});
// Item #0: 0
// Item #1: 1
// Item #2: 2
// 遍历对象
$.each({ name: "John", lang: "JS" }, function(i, n) {
console.log("Name: " + i + ", Value: " + n);
});
// Name: name, Value: John
// Name: lang, Value: JS
退出循环
尽管 ES5 提供了 forEach 方法，但是 forEach 没有办法中止或者跳出 forEach 循环，除了抛出一个异常。但是对于 jQuery 的 each 函数，如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。
$.each( [0, 1, 2, 3, 4, 5], function(i, n){
if (i > 2) return false;
console.log( "Item #" + i + ": " + n );
});
// Item #0: 0
// Item #1: 1
// Item #2: 2
案例1：
<style type="text/css">
.gridtable {
font-family: verdana,arial,sans-serif;
font-size: 11px;
color: #333333;
border- 1px;
border-color: #666666;
border-collapse: collapse;
}
.gridtable th {
border- 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
background-color: #dedede;
}
.gridtable td {
border- 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
background-color: #ffffff;
}
</style>
<body>
<table class="gridtable" id="myTb">
</table>
</body>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var json = {
'columns': [{ 'FieldID': 'Column1', 'Title': 'Info Header 1' }, { 'FieldID': 'Column2', 'Title': 'Info Header2' }, { 'FieldID': 'Column3', 'Title': 'Info Header3' }],
'rows': [{ 'Column1': '1A', 'Column2': '1B', 'Column3': '1C' }, { 'Column1': '2A', 'Column2': '2B', 'Column3': '2C' }]
};
var th;
$.each(json.columns, function (colIndex, col) {
th+="<th>" + col.Title + "</th>";
});
$("#myTb").append("<tr>" + th + "</tr>");
//行遍历
$.each(json.rows, function (rowIndex, row) {
var tr;
//列遍历
$.each(json.columns, function (colIndex,col) {
tr+='<td>'+row[col.FieldID]+'</td>'
});
$("#myTb").append('<tr>'+tr+'</tr>');
});
});
</script>
案例2：
<body>
<div id="tableBox">
<table cellspacing="0" cellpadding="0" border="1px solid #ccc" width="480px">
<thead>
<tr align="center">
<th>序号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
</thead>
<tbody id="tableAdd">
</tbody>
</table>
</div>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var jsonName = {"data": [{"num":1,"name":"张三","sex":"男","age":30}, {"num":2,"name":"李四","sex":"男","age":28}, {"num":3,"name":"赵五","sex":"男","age":26}, {"num":4,"name":"王六","sex":"男","age":25}]}
$.each(jsonName.data,function (rowIndex,col) {//遍历jsonName.data对应的数组
var str;
$.each(col,function (name,value) {//遍历数组内的对象
str += '<td>'+value+'</td>'
});
$("#tableAdd").append("<tr align='center'>"+str+"</tr>");
})
});
</script>
</body>