Итак, я сделал этот javascript код для динамического добавления списка. Я добавил список, в котором есть флажок в моем файле html. По неизвестной причине, это «вкл» было добавлено в список автоматически. Пожалуйста, помогите.
let newList = document.querySelector('input');
let addList = document.getElementById('addBtn');
let ulist = document.querySelector('ul');
newList.addEventListener('change', addNewList);
function addNewList(e) {
let head1 = document.createElement('h1');
let list = document.createElement('li');
let h1Node = document.createTextNode(newList.value);
list.appendChild(head1);
ulist.appendChild(list);
head1.appendChild(h1Node);
h1Node = document.createTextNode("");
}
addList.onclick = addNewList();
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title>Project 1</title>
<script src = "main.js" async></script>
<link href = "main.css" rel = "stylesheet">
<link href="https://fonts.googleapis.com/css?family=Zhi+Mang+Xing&display=swap" rel="stylesheet">
</head>
<body>
<div class = "container">
<div class = "list">
<ul>
<li><h1>Check The Garage</h1></li>
<li><h1>Practice Basketball</h1></li>
<li><h1>Take a shower tonight</h1></li>
<li><h1>Get a girlfriend</h1></li>
<li><input type = "checkbox" style = "float: left; margin-right: 10px;"><h1>List with checkbox</h1></li>
</ul>
<form method = "" action = "">
<input type = "text" id = "to-doList">
</form>
<button type = "submit" id = "addBtn">Add</button>
</div>
</div>
Я хочу избавиться от этого "вкл" в списке. Пожалуйста, кто-нибудь объяснит мне, что происходит и как я могу предотвратить это.