Metodo HTML DOM getElementsByTagName()
❮ L'oggetto elementoEsempio
Modifica il contenuto HTML del primo elemento <li> (indice 0) in un elenco:
var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";
Definizione e utilizzo
Il metodo getElementsByTagName() restituisce una raccolta di elementi figlio di un elemento con il nome del tag specificato, come oggetto NodeList.
L'oggetto NodeList rappresenta una raccolta di nodi. È possibile accedere ai nodi tramite numeri di indice. L'indice inizia da 0.
Suggerimento: puoi utilizzare la proprietà length dell'oggetto NodeList per determinare il numero di nodi figlio con il nome del tag specificato, quindi puoi scorrere tutti i nodi ed estrarre le informazioni desiderate.
Suggerimento: il parametrovalue "*" restituisce tutti gli elementi figlio dell'elemento.
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente il metodo.
Method | |||||
---|---|---|---|---|---|
getElementsByTagName() | 1.0 | 6.0 | 3.0 | 3.0 | 9.5 |
Sintassi
element.getElementsByTagName(tagname)
Valori dei parametri
Parameter | Type | Description |
---|---|---|
tagname | String | Required. The tagname of the child elements you want to get |
Dettagli tecnici
Versione DOM | Oggetto elemento di livello 1 di base |
---|---|
Valore di ritorno: | Un oggetto NodeList, che rappresenta una raccolta di elementi figlio dell'elemento con il nome tag specificato. Gli elementi nella raccolta restituita vengono ordinati come appaiono nel codice sorgente. |
Altri esempi
Esempio
Scopri quanti elementi <p> ci sono all'interno di un elemento <div> (usando la proprietà length dell'oggetto NodeList):
var x =
document.getElementById("myDIV").getElementsByTagName("P").length;
Esempio
Cambia il colore di sfondo del secondo elemento <p> (indice 1) all'interno di un elemento <div>:
var x =
document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor = "red";
Esempio
Cambia il colore di sfondo di tutti gli elementi <p> all'interno di un elemento <div>:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("P");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Esempio
Cambia il colore di sfondo del quarto elemento (indice 3) all'interno di un elemento <div>:
var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red";
Esempio
Utilizzando il parametro "*".
Cambia il colore di sfondo di tutti gli elementi all'interno di un elemento <div>:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("*");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Pagine correlate
Riferimento JavaScript: document.getElementsByTagName()
Esercitazione JavaScript: Elenco nodi JavaScript HTML DOM
❮ L'oggetto elemento