GetElementsByTagName in Javascript
Il metodo getElementsByTagName() mi consente di recuperare i tag della pagina web presenti nel DOM
getElementsByTagName(x)
Dove x è il tag che voglio selezionare.
Un esempio pratico
In questa semplice pagina web sono presenti tre tag <p>
<html>
<head>
</head>
<body>
<p>Test 1</p>
<p>Test 2</p>
<p>Test 3</p>
<script>
var Obj1 = document.getElementsByTagName("p");
</script>
</body>
<html>
Il metodo getElementsByTagName('p') seleziona tutti i tag <p> nel DOM e li scrive nella variabile Obj1
Nella variabile Obj1 sono copiati gli oggetti <p> con tutte le relative proprietà.
Ogni oggetto è numerato con un indice progressivo che parte da zero.
Ad esempio, per stampare il testo contenuto nel primo tag <p> scrivo
document.write(Obj1[0].innerHTML);
In questo caso l'indice tra parentesi quadre Obj1[0] è zero.
Il risultato in output è
Test 1
Per stampare il testo del secondo tag <p> scrivo
document.write(Obj1[1].innerHTML);
In questo caso l'indice tra parentesi quadre Obj1[1] è uno.
Il risultato in output è
Test 2
Ovviamente posso anche modificare il DOM oltre che leggere i dati.
Ad esempio, sostituisco il testo contenuto nel terzo <p> con la stringa "Prova"
Obj2[2].innerHTML="Prova";
In questo modo quando l'utente visualizza la pagina web sul browser vede "Prova" invece di "Test 3".
Test 1
Test 2
Prova
E così via.
