Login

31.10.2022, 22:08

Guten Abend an alle,

ich hab ein Problem mit "appendChild" egal ob ich ein Tutorial aus Google raussuche, ein Youtube Video oder was eigenes erstelle. Sobald es um "appendChild" geht erhalte ich immer Fehler beim Testen. "Uncaught TypeError: Cannot read properties of null (reading 'value')"

ich füge euch mal meine HTML und JS Codes ein vielleicht findet jemand meinen Fehler.
Nachfolgendes habe ich 1 zu 1 übernommen und bei mir erscheint der Fehler.
Quelle: Einkaufslisten Web-App - JavaScript Tutorial für Anfänger (lerneprogrammieren.de)

Index.html

Code:
<!DOCTYPE html>

<html lang="de">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="./style.css" />

    <title>Einkaufsliste</title>

</head>

<body>

    <h1> Einkaufslisten App</h1>

    <img src="https://lerneprogrammieren.de/wordpress/wp-content/uploads/einkaufswagen.png" height="35px">

    <div> 

        <input type="text" placeholder="Neuer Eintrag..">

        <button id="enter"> Hinzufügen</button>

    </div>

    <ul>

    </ul>

    <script src="./main.js"> </script>

</body>

</html>

main.js

Code:
var enterButton = document.getElementById("enter");

  var input = document.getElementById("benutzerInput");

  var ul = document.querySelector("ul");

  var item = document.getElementsByTagName("li");

  enterButton.addEventListener("click", erstellenEintrag);

  function erstellenEintrag() {

    var li = document.createElement("li");

    li.appendChild(document.createTextNode(input.value));

    ul.appendChild(li);

    input.value = "";

  }

wenn ich die Zeilen "li.appendChild(...... und input.value= ""; entferne funktioniert das Erstellen eines leeren li elements ohne Probleme.

Login
Benutzername:
Passwort:	Passwort vergessen?
	Merken