Il metodo hasChildNodes() in Javascript
Il metodo hasChildNodes() in Javascript verifica se un nodo ha dei nodi figli oppure no.
oggetto.hasChildNodes()
E' un modo per chiedere a un nodo se ha dei nodi figli.
Se il nodo ha dei nodi figli restituisce il valore booleano true. In caso contrario, restituisce false.
Nota. Bisogna però fare attenzione perché il metodo considera come nodi figli anche i nodi di testo e i ritorni a capo.
Ad esempio, considero questa pagina HTML:
- <html>
- <body>
- <div id="contenitore">
- <p>Paragrafo 1</p>
- <p>Paragrafo 2</p>
- </div>
- <script>
- let contenitore = document.getElementById("contenitore");
- if (contenitore.hasChildNodes()) {
- document.write("Il contenitore ha nodi figli.");
- } else {
- document.write("Il contenitore non ha nodi figli.");
- }
- </script>
- </body>
- </html>
Lo script trova il nodo con id=contenitore tramite il metodo getElementById("contenitore").
Poi verifica se ha nodi figli usando il metodo hasChildNodes()
Dato che ha nodi figli (i due paragrafi), stampa: "Il contenitore ha nodi figli."
Il contenitore ha nodi figli.
Sapere questa informazione aiuta a decidere se eseguire o meno determinate azioni sul DOM.
Esempio 2
In questo esempio modifico il documento HTML rimuovendo tutti i nodi figli del tag <div>.
- <html>
- <body>
- <div id="contenitore"></div>
- <script>
- let contenitore = document.getElementById("contenitore");
- if (contenitore.hasChildNodes()) {
- document.write("Il contenitore ha nodi figli.");
- } else {
- document.write("Il contenitore non ha nodi figli.");
- }
- </script>
- </body>
- </html>
Ora il nodo non ha più nodi figli.
Quindi, hasChildNodes() restituisce 'false' e lo script stampa "Il contenitore non ha nodi figli."
Il contenitore non ha nodi figli
Esempio 3
Come anticipato, il metodo hasChildNodes() rileva anche i nodi di testo, quindi occorre fare attenzione.
Ad esempio, aggiungo un banale ritorno a capo tra il tag di apertura <div id='contenitore'> e quello di chiusura </div>
- <html>
- <body>
- <div id="contenitore">
- </div>
- <script>
- let contenitore = document.getElementById("contenitore");
- if (contenitore.hasChildNodes()) {
- document.write("Il contenitore ha nodi figli.");
- } else {
- document.write("Il contenitore non ha nodi figli.");
- }
- </script>
- </body>
- </html>
In questo caso, il metodo hasChildNodes() rileva il carattere della nuova linea ( \n ) come nodo di testo e restituisce 'true'.
Quindi, lo script stampa "Il contenitore ha nodi figli."
Il contenitore ha nodi figli.
E' un aspetto importante da ricordare.
E così via.
