卡卡網(wǎng)

本文介紹$.each()循環(huán)遍歷一維數(shù)組、二維數(shù)組、JSON數(shù)據(jù)和DOM元素。

請(qǐng)注意在使用JQuery $.each()方法前，要首先引用jquery庫(kù)文件。

$.each()循環(huán)遍歷一維數(shù)組

Jquery代碼：

//遍歷一維數(shù)組
var arr1 = ["aaa", "bbb", "ccc"];
  $.each(arr1, function(i, val) {
  console.log(i + ". " + val);
});

輸出：

$.each()循環(huán)遍歷一維數(shù)組

execcodegetcode

$.each()循環(huán)遍歷二維數(shù)組

Jquery代碼：

//遍歷二維數(shù)組
var arr2 = [
  ['a', 'aa', 'aaa'],
  ['b', 'bb', 'bbb'],
  ['c', 'cc', 'ccc']
];
$.each(arr2, function(i, item) {
  console.log(i + "====" + item);
  $.each(item, function(j, val) {
    console.log(j + "====" + val)
  });
});

 輸出：

$.each()循環(huán)遍歷二維數(shù)組

execcodegetcode

$.each()循環(huán)遍歷JSON數(shù)據(jù)

Jquery代碼：

//遍歷json數(shù)據(jù)
var obj = {
  one: 1,
  two: 2,
  three: 3
};
$.each(obj, function(key, val) {
  console.log(key + "===" + val)
})

輸出：

$.each()循環(huán)遍歷JSON數(shù)據(jù)

execcodegetcode

$.each()循環(huán)遍歷DOM元素

html標(biāo)記：

<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444" />

Jquery代碼：

//遍歷dom元素
$.each($("input:hidden"), function(i, val) {
  console.log("i===" + i)
  console.log(val.name)
  console.log(val.value)
})

輸出：

$.each()循環(huán)遍歷DOM元素

execcodegetcode

結(jié)論：上面便是$.each()循環(huán)遍歷一維數(shù)組、二維數(shù)組、JSON數(shù)據(jù)和DOM元素的寫(xiě)法，可以舉一反三用于實(shí)際編程環(huán)境中。

標(biāo)簽: each方法  JQuery