小弟今天遇到一個(gè)jQuery數(shù)組對(duì)象的問(wèn)題,添加進(jìn)去,遍歷失敗,找不到什么原因 報(bào)錯(cuò)原因(SyntaxError: missing ; after for-loop initializer),最后... 認(rèn)真看代碼,百度上面找原因,果斷解決了.
找問(wèn)題的同時(shí)找到了幾個(gè)比較有用的東西,拿下來(lái)留著,萬(wàn)一以后有用!
<script src="js/jquery.js" ></script>
<script>
/**
* 從對(duì)象數(shù)組中刪除屬性為objPropery,值為objValue元素的對(duì)象
* @param Array arrPerson 數(shù)組對(duì)象
* @param String objPropery 對(duì)象的屬性
* @param String objPropery 對(duì)象的值
* @return Array 過(guò)濾后數(shù)組
*/
function remove(arrPerson,objPropery,objValue)
{
return $.grep(arrPerson, function(cur,i){
return cur[objPropery]!=objValue;
});
}
/**
* 從對(duì)象數(shù)組中獲取屬性為objPropery,值為objValue元素的對(duì)象
* @param Array arrPerson 數(shù)組對(duì)象
* @param String objPropery 對(duì)象的屬性
* @param String objPropery 對(duì)象的值
* @return Array 過(guò)濾后的數(shù)組
*/
function get(arrPerson,objPropery,objValue)
{
return $.grep(arrPerson, function(cur,i){
return cur[objPropery]==objValue;
});
}
/**
* 顯示對(duì)象數(shù)組信息
* @param String info 提示信息
* @param Array arrPerson 對(duì)象數(shù)組
*/
function showPersonInfo(info,arrPerson)
{
$.each(arrPerson, function(index,callback){
info+="Person id:" + arrPerson[index].id + " name:" + arrPerson[index].name+ " sex:"+ arrPerson[index].sex+" age:"+ arrPerson[index].age+"/r/t";
});
alert(info);
}
//測(cè)試數(shù)據(jù)
var arrPerson=new Array();
var person=new Object();
person.id=1;
person.name="帥哥";
person.sex="男";
person.age=30;
arrPerson.push(person);
person=new Object();
person.id=2;
person.name="美眉甲";
person.sex="女";
person.age=28;
arrPerson.push(person);
person=new Object();
person.id=3;
person.name="美眉乙";
person.sex="女";
person.age=20;
arrPerson.push(person);
//測(cè)試刪除
showPersonInfo("原始數(shù)組:/r/t",arrPerson);
arrPerson=remove(arrPerson,"id",1);
showPersonInfo("刪除之后:/r/t",arrPerson);
//測(cè)試獲取
arrPerson=get(arrPerson,"id",3);
showPersonInfo("只獲取ID為3的元素:/r/t",arrPerson);
</script>
通過(guò)它,你可以遍歷對(duì)象、數(shù)組的屬性值并進(jìn)行處理。
使用說(shuō)明
each函數(shù)根據(jù)參數(shù)的類型實(shí)現(xiàn)的效果不完全一致:
1、遍歷對(duì)象(有附加參數(shù))
1 2 3 4 | $.each(Object, function (p1, p2) { this ; //這里的this指向每次遍歷中Object的當(dāng)前屬性值 p1; p2; //訪問(wèn)附加參數(shù) }, [ '參數(shù)1' , '參數(shù)2' ]); |
2、遍歷數(shù)組(有附件參數(shù))
1 2 3 4 | $.each(Array, function (p1, p2){ this ; //這里的this指向每次遍歷中Array的當(dāng)前元素 p1; p2; //訪問(wèn)附加參數(shù) }, [ '參數(shù)1' , '參數(shù)2' ]); |
3、遍歷對(duì)象(沒(méi)有附加參數(shù))
1 2 3 4 5 | $.each(Object, function (name, value) { this ; //this指向當(dāng)前屬性的值 name; //name表示Object當(dāng)前屬性的名稱 value; //value表示Object當(dāng)前屬性的值 }); |
4、遍歷數(shù)組(沒(méi)有附加參數(shù))
1 2 3 4 5 | $.each(Array, function (i, value) { this ; //this指向當(dāng)前元素 i; //i表示Array當(dāng)前下標(biāo) value; //value表示Array當(dāng)前元素 }); |
下面提一下jQuery的each方法的幾種常用的用法
Js代碼
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | var arr = [ "one" , "two" , "three" , "four" ]; $.each(arr, function (){ alert( this ); }); //上面這個(gè)each輸出的結(jié)果分別為:one,two,three,four var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]] $.each(arr1, function (i, item){ alert(item[0]); }); //其實(shí)arr1為一個(gè)二維數(shù)組,item相當(dāng)于取每一個(gè)一維數(shù)組, //item[0]相對(duì)于取每一個(gè)一維數(shù)組里的第一個(gè)值 //所以上面這個(gè)each輸出分別為:1 4 7 var obj = { one:1, two:2, three:3, four:4}; $.each(obj, function (key, val) { alert(obj[key]); }); //這個(gè)each就有更厲害了,能循環(huán)每一個(gè)屬性 //輸出結(jié)果為:1 2 3 4 |
參考地址:http://www.w3school.com.cn/jsref/jsref_obj_array.asp
聯(lián)系客服