HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>To-Do List</title> <link href="todo.css" rel="stylesheet"/> </head> <body> <h1>To-Do List</h1> <div class="todo"> <form class="todo__form"> <input class="todo__input" type="text"> <input class="todo__submit" type="submit" value="Submit"> <input class="todo__clear" type="button" value="Clear"> </form> </div> <div class="todo-list"> <li></li> </div> <script src="todo.js"></script> </body> </html> JavaScript
const toDoForm = document.querySelector(".todo__form"), toDoInput = document.querySelector(".todo__input"); toDoList = document.querySelector("li"); let toDoArray = []; function addToDoList() { toDoForm.addEventListener('submit', event => { toDoArray.push(toDoInput.value); toDoList.innerHTML += `<ul>${toDoArray[toDoArray.length-1]}</ul>`; event.preventDefault(); toDoInput.value = ""; }); } function clearList() { const toDoUl = document.querySelector("ul"); toDoForm.addEventListener('click', event => { toDoArray = []; toDoUl.parentNode.removeChild(toDoUl); }); } function init() { addToDoList(); clearList(); } init(); I'm making a to-do list with javascript and i tried to use removeChild method to clear to-do list but when i run the code, it keeps getting an error like this -> Uncaught TypeError: Cannot read property 'parentNode' of null at HTMLFormElement. How can i solve it?
https://stackoverflow.com/questions/65535258/how-to-use-removechild-method January 02, 2021 at 09:25AM
没有评论:
发表评论