getElementsByClassName come mai non funziona con i div

**pmi** · 08-09-2021, 08:58

Ciao,
sono un principianti di JS, vorrei sapere come mai getElementsByClassName non mi funziona con i div.
Grazie

codice:

<!DOCTYPE html>
<html>
<body>

<div class="test">Orange</div>

<button onclick="myFunction()">Try it</button>


<script>
function myFunction() {
  
  var myDiv = document.getElementsByClassName("test")[0];
  myDiv.getElementsByClassName("test")[0].innerHTML = "Milk";

}
</script>

</body>
</html>

**ninja72** · 08-09-2021, 09:54

C'è un errore evidente nello script js, ma anche come sintassi sa di vecchio (es5), ti consiglio un approccio più attuale. Ricorda inoltre che innerHTML serve per inserire codice html all'interno del DOM, nel tuo caso è sicuramente più indicato textContent visto che devi inserire solo testo.

es5 style :

codice:

<div class="test">Orange</div>

    <button onclick="myFunction()">Try it</button>

    <script>
        function myFunction() {
            var myDiv = document.getElementsByClassName("test")[0];
            myDiv.textContent = "Milk";
        }
    </script>

es6 style :

codice:

 <div class="test">Orange</div>

    <button id='myButton'>Try it</button>

    <script>
        const myButton = document.getElementById('myButton')
        const myDiv = document.getElementsByClassName("test")[0]

        myButton.addEventListener('click', myFunction)

        function myFunction() { myDiv.textContent = "Milk" }
    </script>

**pmi** · 09-09-2021, 22:58

Grazie mille per le dritte.
Hai qualche suggerimento per impare un Javascritp più attuale e meno datato?
In giro c'è un sacco di roba, ma saperla filtrare è un affare da esperti.
Grazie di nuovo e complimenti per la competenza

Discussione: getElementsByClassName come mai non funziona con i div

Strumenti discussione

Ricerca discussione

Visualizza

Hybrid View

getElementsByClassName come mai non funziona con i div

Permessi di invio