vollständig
gekürzt
<!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8"> <title>JSL124 Nodelist</title> </head> <body> <ul id="meineListe"> <li>Physik</li> <li>Chemie</li> <li>Mathe</li> </ul> <input id="neuesFach" type="text" placeholder="Neues Fach"> <button onClick="einesMehr();">Fach hinzufügen</button> <script> function einesMehr() { var neuerEintrag = document.getElementById("neuesFach").value; var neuesElement = document.createElement("li"); var neuerText = document.createTextNode(neuerEintrag); neuesElement.appendChild(neuerText); var elternElement = document.getElementById("meineListe"); elternElement.appendChild(neuesElement); } </script> <hr> <button onClick="listeAnzeigen();">Nr. 2 anzeigen</button> <script> function listeAnzeigen() { var dListe = document.getElementById("meineListe"); var mListe = dListe.querySelectorAll("li"); alert("Anzahl " + mListe.length); alert("Nr. 2 ist " + mListe[1].innerHTML); } </script> </body> </html>
