我一直在努力弄清楚，但什么都没有。我是Java语言的新手，所以我只是在测试如何将项目添加到待办事项列表中，然后单击li项目将其划掉。
我已经能够做到所有这些，但是我正在努力的地方是：
添加新列表项时，删除它的功能不起作用。我不知道该怎么解决？
var input = document.getElementById("input");
var btn = document.getElementById("btn");
var ul = document.querySelector("ul");
var li = document.querySelectorAll("li");
function getLength() {
return input.value.length;
};
function createElement() {
var li = document.createElement("li");
li.appendChild(document.createTextNode(input.value));
ul.appendChild(li);
input.value = "";
};
function click() {
if (getLength() > 0) {
createElement();
}
};
function keyPress() {
if (getLength() > 0 && event.which === 13) {
createElement();
}
};
function strikeThrough(item) {
item.addEventListener("click", function() {
item.classList.toggle("done");
})
};
li.forEach(strikeThrough);
btn.addEventListener("click", click);
input.addEventListener("keypress", keyPress);<!DOCTYPE html>
<html>
<head>
<title>WORK TO DO LIST</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>LIST OF THINGS TO COMPLETE</h1>
<input id="input" type="text" placeholder="Enter">
<button id="btn">Enter</button>
<ul>
<li>This is a starter</li>
</ul>
<script type="text/javascript" src="actions.js"></script>
</body>
</html>您未将任何元素传递给strikeThrough函数。将呼叫更改为：
li.forEach((e) => { strikeThrough(e); });
此外，在切换.done类之后，您应该添加一些css，以使元素获得删除线；
.done {
text-decoration: line-through;
}
创建新的<li>之后，您应该再次调用该函数并添加事件侦听器，因此在createElement()函数内部：
strikeThrough(li);
var input = document.getElementById("input");
var btn = document.getElementById("btn");
var ul = document.querySelector("ul");
var li = document.querySelectorAll("li");
function getLength() {
return input.value.length;
};
function createElement() {
var li = document.createElement("li");
li.appendChild(document.createTextNode(input.value));
ul.appendChild(li);
input.value = "";
strikeThrough(li);
};
function click() {
if (getLength() > 0) {
createElement();
}
};
function keyPress() {
if (getLength() > 0 && event.which === 13) {
createElement();
}
};
function strikeThrough(item) {
item.addEventListener("click", function() {
item.classList.toggle("done");
})
};
li.forEach((e) => {strikeThrough(e); });
btn.addEventListener("click", click);
input.addEventListener("keypress", keyPress);.done {
text-decoration: line-through;
}<!DOCTYPE html>
<html>
<head>
<title>WORK TO DO LIST</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>LIST OF THINGS TO COMPLETE</h1>
<input id="input" type="text" placeholder="Enter">
<button id="btn">Enter</button>
<ul>
<li>This is a starter</li>
</ul>
<script type="text/javascript" src="actions.js"></script>
</body>
</html>