Pridávanie/odstraňovanie položiek z objektu JavaScript pomocou jQuery

Mám nasledujúci objekt 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"}
]};

Ak by som chcel do tohto zoznamu pridávať/odstraňovať položky, ako by som to urobil pomocou jQuery? Klient chce, aby sa tento zoznam dal dynamicky upravovať.

Riešenie

Po prvé, váš citovaný kód nie je JSON. Váš kód je objektový literálny zápis v jazyku JavaScript. [JSON][1] je jeho podmnožinou určenou na jednoduchšie analyzovanie.

Váš kód definuje objekt (data) obsahujúci pole (items) objektov (každý s id, name a type).

Na to nepotrebujete ani nechcete jQuery, stačí JavaScript.

Pridanie položky:

data.items.push(
    {id: "7", name: "Douglas Adams", type: "comedy"}
);

To sa pridá na koniec. Pre pridanie do stredu pozri nižšie.

Odstránenie položky:

Existuje niekoľko spôsobov. Spôsob [splice][2] je najuniverzálnejší:

data.items.splice(1, 3); // Removes three items starting with the 2nd,
                         // ("Witches of Eastwick", "X-Men", "Ordinary People")

splice upraví pôvodné pole a vráti pole odstránených položiek.

Pridanie v strede:

splice v skutočnosti vykonáva pridávanie aj odstraňovanie. Signatúra metódy splice je:

removed_items = arrayObject.splice(index, num_to_remove[, add1[, add2[, ...]]]);
  • index - index, od ktorého sa majú začať vykonávať zmeny
  • num_to_remove - počnúc týmto indexom odstráňte tento počet záznamov
  • addN - ...a potom vložte tieto prvky

Takže môžem pridať prvok na 3. pozíciu takto:

data.items.splice(2, 0,
    {id: "7", name: "Douglas Adams", type: "comedy"}
);

To znamená, že: Počnúc indexom 2 odstráňte nulové položky a potom vložte túto nasledujúcu položku. Výsledok vyzerá takto:


var data = {items: [
    {id: "1", name: "Snatch", type: "crime"},
    {id: "2", name: "Witches of Eastwick", type: "comedy"},
    {id: "7", name: "Douglas Adams", type: "comedy"},     // 
Komentáre (6)

To vôbec nie je JSON, sú to len objekty Javascriptu. JSON je textová reprezentácia údajov, ktorá používa podmnožinu syntaxe jazyka Javascript.

Dôvod, prečo nemôžete nájsť žiadne informácie o manipulácii s JSON pomocou jQuery, je ten, že jQuery nemá nič, čo by to dokázalo, a vo všeobecnosti sa to vôbec nerobí. Manipulujete s údajmi vo forme objektov Javascriptu a potom ich premeníte na reťazec JSON, ak to potrebujete. (JQuery však má metódy na konverziu.)

To, čo máte, je jednoducho objekt, ktorý obsahuje pole, takže môžete využiť všetky znalosti, ktoré už máte. Na prístup k poľu stačí použiť data.items.

Napríklad na pridanie ďalšej položky do poľa pomocou dynamických hodnôt:

// 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);
Komentáre (0)

Je to len javascriptový objekt, takže s data.items môžete manipulovať rovnako ako s bežným poľom. Ak tak urobíte:

data.items.pop();

vaše pole položky bude o 1 položku kratšie.

Komentáre (0)