Imam naslednji predmet 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"}
]};
Če bi želel na ta seznam dodati/odstraniti elemente, kako bi to storil z uporabo jQueryja? Stranka želi, da se ta seznam dinamično spreminja.
Prvič, vaša citirana koda ni ne JSON. Vaša koda je objektni dobesedni zapis v jeziku JavaScript. JSON je podmnožica tega zapisa, namenjena lažjemu razčlenjevanju.
Vaša koda opredeljuje objekt (data
), ki vsebuje polje (items
) objektov (vsak z id
, name
in type
).
Za to ne potrebujete ali želite jQueryja, ampak samo JavaScript.
Dodajanje elementa:
data.items.push(
{id: "7", name: "Douglas Adams", type: "comedy"}
);
To se doda na konec. Za dodajanje na sredino glej spodaj.
Odstranjevanje elementa:
Obstaja več načinov. Metoda splice
je najbolj vsestranska:
data.items.splice(1, 3); // Removes three items starting with the 2nd,
// ("Witches of Eastwick", "X-Men", "Ordinary People")
splice
spremeni prvotno polje in vrne polje odstranjenih elementov.
Pridajanje na sredini:
splice
dejansko opravi tako dodajanje kot odstranjevanje. Podpis metode splice
je:
removed_items = arrayObject.splice(index, num_to_remove[, add1[, add2[, ...]]]);
index
- indeks, pri katerem se začnejo spremembeštevilo_za_odstranitev
- začenši s tem indeksom, odstrani tolikšno število vnosovaddN
- ...in nato vstavi te elementeTako lahko dodam element na 3. mesto na naslednji način:
data.items.splice(2, 0,
{id: "7", name: "Douglas Adams", type: "comedy"}
);
To pomeni: Začni z indeksom 2, odstrani nič elementov in nato vstavi naslednji element. Rezultat je videti takole:
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"}
]};
Nekaj elementov lahko odstranite in nekaj dodate hkrati:
data.items.splice(1, 3,
{id: "7", name: "Douglas Adams", type: "comedy"},
{id: "8", name: "Dick Francis", type: "mystery"}
);
...kar pomeni: Začni pri indeksu 1, odstrani tri vnose, nato dodaj ta dva vnosa. Rezultat je:
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"}
]};
To sploh ni JSON, ampak samo objekti Javascript. JSON je besedilna predstavitev podatkov, ki uporablja podmnožico sintakse Javascript.
Razlog, da ne najdete nobenih informacij o ravnanju z JSON z uporabo programa jQuery, je v tem, da program jQuery nima ničesar, kar bi to omogočalo, in da se to na splošno sploh ne počne. S podatki manipulirate v obliki objektov Javascript in jih nato spremenite v niz JSON, če to potrebujete. (Vendar ima jQuery metode za pretvorbo.)
Kar imate, je preprosto objekt, ki vsebuje polje, zato lahko uporabite vse znanje, ki ga že imate. Za dostop do polja uporabite data.items
.
Če želite na primer dodati še en element v polje z uporabo dinamičnih vrednosti:
// 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);