HTML and CSS Reference
In-Depth Information
//Recupera tutti i nodi figli del nodo obj
var childNodes = obj.childNodes();
//Recupera il primo nodo figlio del nodo obj
var firstChild = obj.firstChild();
//Recupera l'ultimo nodo figlio del nodo obj
var lastChild = obj.lastChild();
//Recupera il nodo successivo al nodo obj sullo stesso li-
vello
var nextSibling = obj.nextSibling();
//Recupera il nodo precedente al nodo obj sullo stesso li-
vello
var previousSibling = obj.previousSibling();
//Recupera il nodo padre del nodo obj
var parent = obj.parentNode();
Questo esempio mostra che il codice da scrivere è estremamente semplice ed efficace. Tut-
tavia, si può fare di meglio e risparmiare ulteriori righe di codice attraverso due metodi
( querySelector e querySelectorAll ) che offrono molta più flessibilità nella ri-
cerca degli oggetti nel DOM e che sono argomento del prossimo paragrafo.
Utilizzare i selettori CSS per navigare il DOM
Il metodo querySelector effettua una query sul DOM e restituisce il primo oggetto
restituito dalla query. Se la query restituisce più oggetti, al codice viene restituito solo il
primo. Se la query non restituisce nemmeno un oggetto, viene restituito null .
Il metodo querySelectorAll effettua una query sul DOM e restituisce tutti gli og-
getti recuperati. Qualunque quantità di oggetti sia recuperata dalla query (nessuno, uno o
più di uno) il metodo querySelectorAll restituisce una lista.
Quello che rende veramente speciali i metodi querySelector e querySelecto-
rAll è il fatto che, per ricercare gli oggetti da recuperare, utilizzano i selettori CSS. Gli
esempi che sono mostrati nel codice qui sotto danno una precisa idea di quanto questi me-
todi semplifichino la vita.
Search WWH ::




Custom Search