我有一个JavaScript对象,如下所示:
var data = {items: [ {id: "1", name: "Snatch", type: "crime"}, {id: "2", name: "Witches of Eastwick", type: "comedy"}, {id: "3", name: "X-Men", type: "action"}, {id: "4", name: "Ordinary People", type: "drama"}, {id: "5", name: "Billy Elliot", type: "drama"}, {id: "6", name: "Toy Story", type: "children"} ]};
如果我想在此列表中添加/删除项目,我将如何使用jQuery进行处理?客户希望该列表是可动态修改的。
首先,您引用的代码 不是 JSON。您的代码是JavaScript对象文字表示法。JSON是为简化解析而设计的子集。
您的代码定义的对象(data包含数组()items对象)(每个都具有id,name和type)。
data
items
id
name
type
您不需要或不需要jQuery,而只需JavaScript。
添加项目:
data.items.push( {id: "7", name: "Douglas Adams", type: "comedy"} );
这增加了最后。参见下面的中间添加。
删除项目:
有几种方法。该splice方法最通用:
splice
data.items.splice(1, 3); // Removes three items starting with the 2nd, // ("Witches of Eastwick", "X-Men", "Ordinary People")
splice 修改原始数组,并返回您删除的项目的数组。
在中间添加:
splice实际上既添加又删除。该splice方法的签名是:
removed_items = arrayObject.splice(index, num_to_remove[, add1[, add2[, ...]]]);
index
num_to_remove
addN
所以我可以在第3个位置添加一个项目,如下所示:
data.items.splice(2, 0, {id: "7", name: "Douglas Adams", type: "comedy"} );
这就是说:从索引2开始,删除零个项目,然后插入以下项目。结果看起来像这样:
var data = {items: [ {id: "1", name: "Snatch", type: "crime"}, {id: "2", name: "Witches of Eastwick", type: "comedy"}, {id: "7", name: "Douglas Adams", type: "comedy"}, // <== The new item {id: "3", name: "X-Men", type: "action"}, {id: "4", name: "Ordinary People", type: "drama"}, {id: "5", name: "Billy Elliot", type: "drama"}, {id: "6", name: "Toy Story", type: "children"} ]};
您可以删除并立即添加一些:
data.items.splice(1, 3, {id: "7", name: "Douglas Adams", type: "comedy"}, {id: "8", name: "Dick Francis", type: "mystery"} );
…这意味着:从索引1开始,删除三个条目,然后添加这两个条目。结果是:
var data = {items: [ {id: "1", name: "Snatch", type: "crime"}, {id: "7", name: "Douglas Adams", type: "comedy"}, {id: "8", name: "Dick Francis", type: "mystery"}, {id: "4", name: "Ordinary People", type: "drama"}, {id: "5", name: "Billy Elliot", type: "drama"}, {id: "6", name: "Toy Story", type: "children"} ]};