Javascript 复选框-单击待办事项列表复选框时划掉文本

我一直在看一个教程，内容是如何在单击文本旁边的

复选框时划掉文本，而我的代码不起作用，尽管它与教程中的代码相同（在教程中效果很好）。

我一直在看我的代码很长时间，但看不出有什么错，也许这只是一个我看不到的打字错误…有人知道为什么吗

下面是JavaScript代码（只是相关部分）

您的主要问题是您有
span.innerHtml=textItem在实际获取值之前设置
var textItem=document.getElementById（“textItem”）

但是嘿

仅CSS：


标签{
显示：块；
}
标签输入[类型=复选框]：选中+范围{
文字装饰：线条贯通；
}

买咖啡
就此提出问题
喝咖啡
一点检查告诉我，您的文本不是添加到您的
span
中，而是添加到条目本身

这是我对你问题的复制


var totalItems=0；
函数updateItem（）{
var cbId=this.id.replace（“cb_u”）；
var textItem=document.getElementById（“项”+cbId）；
textItem.style.textDecoration=“直线通过”；
}
函数addItem（）{
totalItems++；
var条目=document.createElement（“li”）；
var checkBox=document.createElement（“输入”）；
checkBox.type=“checkBox”；
checkBox.id=“cb_”+totalItems；
checkBox.onclick=更新项；
var span=document.createElement（“span”）；
span.id=“项目”+总项目；
span.innerHtml=textItem；
var textItem=document.getElementById（“textItem”）；
entry.innerText=textItem.value；//您正在对已经创建的文本使用css（购买咖啡、提问等）但是我没有在我的html文件中创建任何文本，因为它是一个待办事项列表，所以内容是通过键入一些内容来创建的，然后单击复选框时，它应该被删除。@learningcoding我没有说你不应该在
ADD todo ITEM
部分使用JS，我只是说你可以单独使用CSS来交叉项目。@learningcoding扩展了我的答案。希望能给我一些启示。我真的只是想知道我的代码中有什么错误，这样我就能理解我做了什么wrong@learningcodingJS主要是关于DOM操作的，您在问题中只展示了JS。您应该展示一个最小且可验证的代码片段，这意味着添加一些HTML和CSS（如果与演示相关）。您应该真正创建/显示反映您的问题的最小但完整的代码。您的
totalItems
变量定义在哪里？您的主要问题是在实际获取值之前设置了
span.innerHtml=textItem；
var textItem=document.getElementById（“textItem”）
谢谢！它现在可以工作了。唯一的问题是，因为我将其更改为span.innerText=textItem.value；文本移到了右侧-之前它就在复选框旁边/之后，现在它移到了右侧。关于移到正确的问题，我想您可能需要查看特定位置的span样式，text align、 顺便说一下，切换css类而不是设置内联样式总是更好的做法。
function updatingItem() {

  var cbId = this.id.replace("cb_", "");
  var textItem = document.getElementById("item_" + cbId);
  textItem.style.textDecoration = "line-through";
}

function addItem() {

  totalItems++;
  var entry = document.createElement("li");
  var checkBox = document.createElement("input");
  checkBox.type = "checkbox";
  checkBox.id = "cb_" + totalItems;
  checkBox.onclick = updatingItem;

  var span = document.createElement("span");
  span.id = "item_" + totalItems;
  span.innerHtml = textItem;

  var textItem = document.getElementById("textItem");
  entry.innerText = textItem.value;
  var location = document.getElementById("todoList");

  entry.appendChild(checkBox);
  entry.appendChild(span);
  location.appendChild(entry);
}