У меня есть объект 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
).
Для этого вам не нужен jQuery, только JavaScript.
Добавление элемента:
data.items.push(
{id: "7", name: "Douglas Adams", type: "comedy"}
);
Добавляет в конец. О добавлении в середину см. ниже.
Удаление элемента:
Есть несколько способов. Метод 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"}
]};
Сращивания Хороший, все объяснит соединения, поэтому я не'т объяснить это. Вы также можете использовать удалить ключевое слово в JavaScript, это's хорошо. Вы можете использовать $.грэп также манипулировать этой помощью jQuery.
В jQuery так :
data.items = jQuery.grep(
data.items,
function (item,index) {
return item.id != "1";
});
Удалить так:
delete data.items[0]
Для добавления пуш лучше соединить, потому что соединения тяжелых весовых функций. Соединения создать новый массив , если у вас огромной размер массива, то это может быть хлопотно. удалить это иногда полезно, после удаления, Если вы ищите длина массива, то есть никаких изменений в длине есть. Так что используйте его с умом.
Если вы с помощью jQuery вы можете использовать функцию расширения для добавления новых элементов.
var olddata = {"fruit":{"apples":10,"pears":21}};
var newdata = {};
newdata['vegetables'] = {"carrots": 2, "potatoes" : 5};
$.extend(true, olddata, newdata);
Это будет генерировать:
{"fruit":{"apples":10,"pears":21}, "vegetables":{"carrots":2,"potatoes":5}};
Это'вовсе не JSON, это'просто объекты Javascript. JSON - это текстовое представление данных, которое использует подмножество синтаксиса Javascript.
Причина, по которой вы не можете найти никакой информации о манипулировании JSON с помощью jQuery, заключается в том, что в jQuery нет ничего, что могло бы это сделать, и, как правило, это вообще не делается. Вы манипулируете данными в виде объектов Javascript, а затем превращаете их в строку JSON, если это то, что вам нужно. (Хотя в jQuery есть методы для преобразования).
То, что у вас есть, - это просто объект, содержащий массив, поэтому вы можете использовать все знания, которые у вас уже есть. Просто используйте data.items
для доступа к массиву.
Например, чтобы добавить еще один элемент в массив, используя динамические значения:
// The values to put in the item
var id = 7;
var name = "The usual suspects";
var type = "crime";
// Create the item using the values
var item = { id: id, name: name, type: type };
// Add the item to the array
data.items.push(item);
Ну, это просто объект javascript, поэтому вы можете манипулировать data.items
так же, как и обычным массивом. Если вы сделаете:
data.items.pop();
ваш массив items
станет на 1 элемент короче.
Добавление объекта в массив JSON
var arrList = [];
var arr = {};
arr['worker_id'] = worker_id;
arr['worker_nm'] = worker_nm;
arrList.push(arr);
Удаление объекта из JSON
Это работник для меня.
arrList = $.grep(arrList, function (e) {
if(e.worker_id == worker_id) {
return false;
} else {
return true;
}
});
Он возвращает массив без этого объекта.
Надеюсь, что это помогает.
Попробовать
data.items.pop();
data.items.push({id: "7", name: "Matrix", type: "adult"});
в
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"}
]};
data.items.pop();
data.items.push({id: "7", name: "Matrix", type: "adult"});
console.log(data);
в