jquery的物件陣列的新增元素,刪除元素
jquery物件陣列
小弟今天遇到一個jquery陣列物件的問題,新增進去,遍歷失敗,找不到什麼原因 報錯原因(SyntaxError: missing ; after for-loop initializer),最後... 認真看程式碼,百度上面找原因,果斷解決了.
找問題的同時找到了幾個比較有用的東西,拿下來留著,萬一以後有用!
<script src="js/jquery.js" ></script>
<script>
/**
* 從物件陣列中刪除屬性為objPropery，值為objValue元素的物件
* @param Array arrPerson 陣列物件
* @param String objPropery 物件的屬性
* @param String objPropery 物件的值
* @return Array 過濾後陣列
*/
function remove(arrPerson,objPropery,objValue)
{
return $.grep(arrPerson, function(cur,i){
return cur[objPropery]!=objValue;
});
}
/**
* 從物件陣列中獲取屬性為objPropery，值為objValue元素的物件
* @param Array arrPerson 陣列物件
* @param String objPropery 物件的屬性
* @param String objPropery 物件的值
* @return Array 過濾後的陣列
*/
function get(arrPerson,objPropery,objValue)
{
return $.grep(arrPerson, function(cur,i){
return cur[objPropery]==objValue;
});
}
/**
* 顯示物件陣列資訊
* @param String info 提示資訊
* @param Array arrPerson 物件陣列
*/
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);
}
//測試資料
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);
//測試刪除
showPersonInfo("原始陣列：/r/t",arrPerson);
arrPerson=remove(arrPerson,"id",1);
showPersonInfo("刪除之後：/r/t",arrPerson);
//測試獲取
arrPerson=get(arrPerson,"id",3);
showPersonInfo("只獲取ID為3的元素：/r/t",arrPerson);
</script>
$.each遍歷物件、陣列的屬性值並進行處理
通過$.each，可以遍歷物件、陣列的屬性值並進行處理，下面有個示例，需要的朋友可以參考下通過它，你可以遍歷物件、陣列的屬性值並進行處理。
使用說明
each函式根據引數的型別實現的效果不完全一致：
1、遍歷物件(有附加引數)
| 1 2 3 4 |
$.each(Object,
function(p1, p2) {
this;
//這裡的this指向每次遍歷中Object的當前屬性值
p1; p2; //訪問附加引數
}, ['引數1',
'引數2']);
|
2、遍歷陣列(有附件引數)
| 1 2 3 4 |
$.each(Array, function(p1, p2){
this;
//這裡的this指向每次遍歷中Array的當前元素
p1; p2; //訪問附加引數
}, ['引數1',
'引數2']);
|
3、遍歷物件(沒有附加引數)
| 1 2 3 4 5 |
$.each(Object,
function(name, value) {
this;
//this指向當前屬性的值
name; //name表示Object當前屬性的名稱
value; //value表示Object當前屬性的值
});
|
4、遍歷陣列(沒有附加引數)
| 1 2 3 4 5 |
$.each(Array,
function(i, value) {this;
//this指向當前元素
i; //i表示Array當前下標
value; //value表示Array當前元素
});
|
下面提一下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);
});
//上面這個each輸出的結果分別為：one,two,three,four
var
arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]
$.each(arr1,
function(i, item){
alert(item[0]);
});
//其實arr1為一個二維陣列，item相當於取每一個一維陣列，
//item[0]相對於取每一個一維數組裡的第一個值
//所以上面這個each輸出分別為：1 4 7
var
obj = { one:1, two:2, three:3, four:4};
$.each(obj,
function(key, val) {
alert(obj[key]);
});
//這個each就有更厲害了，能迴圈每一個屬性
//輸出結果為：1 2 3 4
|
在前提不知道b在這個陣列的下標，刪除b這個元素
var arrList = ['a','b','c','d'];
arrList.splice(jQuery.inArray('b',arrList),1);
alert(arrList);
其中jQuery.inArray('b',arrList)是b這個元素在陣列arrList 中的位置
splice(index,1)函式中第一個引數index是要刪除元素在陣列中的位置，第二個引數是要刪除的數量。
Array物件的方法有：
concat()連線兩個或更多的陣列，並返回結果。
join()把陣列的所有元素放入一個字串。元素通過指定的分隔符進行分隔。
pop()刪除並返回陣列的最後一個元素。
push()向陣列的末尾新增一個或更多元素，並返回新的長度。
reverse()顛倒陣列中元素的順序。
shift()刪除並返回陣列的第一個元素
slice()從某個已有的陣列返回選定的元素
sort()對陣列的元素進行排序
splice()刪除元素，並向陣列新增新元素。
toSource()返回該物件的原始碼。
toString()把陣列轉換為字串，並返回結果。
toLocaleString()把陣列轉換為本地陣列，並返回結果。
unshift()向陣列的開頭新增一個或更多元素，並返回新的長度。
valueOf()返回陣列物件的原始值。
var arrList = new Array();
arrList.push("abc");
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join())