1. 程式人生 > >$.each(),$().each()和forEach()

$.each(),$().each()和forEach()

【1】$().each(function(){})

對於這個方法,在dom處理上面用的較多。

如果頁面有多個input標籤型別為checkbox,對於這時用$().each來處理多個checkbook,例如:

$("input[name='ch']").each(function(index){
if($(this).attr("checked")==true)
{
    //一些操作程式碼
}

回撥函式是可以傳遞引數,index就為遍歷的索引。

【2】$.each(parentData,function(index,childData){})

對於這個方法,在陣列資料處理上面用的較多。

這裡寫圖片描述

遍歷JSON:

$.each([{"name":"limeng","email":"xfjylimeng"},{"name":"hehe","email":"fjylimeng"}],function(index,data)
{
alert("索引:"+index+","+"對應值為:"+data.name);
});

遍歷MAP:
var obj = { one:1, two:2, three:3, four:4, five:5 };
$.each(obj, function(key, val) {
alert(obj[key]);
});

遍歷list:
var arr1 = [ "one"
, "two", "three", "four", "five" ]; $.each(arr1, function(){ alert(this); }); 輸出:one two three four five 遍歷陣列: var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]] $.each(arr2, function(i, item){ alert(item[0]); }); 輸出:1 4 7

遍歷JSON並取資料進行操作

$.each(countyJson, function(index, data) {
            if
(data.parent == selValue) { var option = "<option value='" + data.id + "'>" + data.county + "</option>"; $("#selDistrict").append(option); } });

注意,此處的json為JS物件,若為字串,使用JSON.parse()或jQuery 的 $.parseJSON 將其轉換為JavaScript物件。

var json = '[{"id":"1","tagName":"apple"},{"id":"2","tagName":"orange"},
{"id":"3","tagName":"banana"},{"id":"4","tagName":"watermelon"},
{"id":"5","tagName":"pineapple"}]';

$.each(JSON.parse(json), function(idx, obj) {
    alert(obj.tagName);
});

//or 

$.each($.parseJSON(json), function(idx, obj) {
    alert(obj.tagName);
});

【3】forEach()

forEach() 方法用於呼叫陣列的每個元素,並將元素傳遞給回撥函式。

注意: forEach() 對於空陣列是不會執行回撥函式的。

語法格式如下:

array.forEach(function(currentValue, index, arr), thisValue)

引數解析如下:

這裡寫圖片描述

示例如下:

var arr=[1,2,3,4];
arr.forEach(function(val,index,arr){
    arr[index]=2*val;
});
console.log(arr);//結果是修改了原陣列,為每個數乘以2

結果如下:

這裡寫圖片描述