JavaScript通过innerText删除无效

我正在尝试创建一个待办事项列表，但在删除已创建的待办事项时遇到问题。“完成后单击”按钮出现在已创建待办事项的右侧，单击该按钮时，应删除文本。我很确定这是（e.target.newToDo.innerText.strike（））的一个问题

是否需要为newToDo.innerText创建变量？自从我在前面的函数中创建了（newToDo.innerText=input.value）之后，我还能够创建一个吗

我只想说，这个网站上的人都很了不起，他们帮了很多忙。提前谢谢你

const form=document.querySelector（'addToDo'）；
常量输入=document.querySelector（“#theToDo”）；
const todolist=document.querySelector（“#todolist”）；
表.addEventListener（'submit'，函数（e）{
e、 预防默认值（）；
const newToDo=document.createElement（'li'）；
const removeBtn=document.createElement（'button'）；
const completeBtn=document.createElement（'button'）；
newToDo.innerText=input.value；
removeBtn.innerText='单击以删除'；
completetbtn.innerText='完成后单击'；
新的附录（completeBtn）；
newToDo.appendChild（removeBtn）；
input.value=''；
托多利斯特·阿佩奇尔德（纽托多）；
CompleteTn.addEventListener（“单击”，函数（e）{
e、 target.newToDo.innerText.strike（）；
})
removeBtn.addEventListener（“单击”），函数（e）{
e、 target.parentElement.remove（）；
})
})

待办事项清单：


提交

const form=document.querySelector（'addToDo'）；
常量输入=document.querySelector（“#theToDo”）；
const todolist=document.querySelector（“#todolist”）；
表.addEventListener（'submit'，函数（e）{
e、 预防默认值（）；
const newToDo=document.createElement（'li'）；
const removeBtn=document.createElement（'button'）；
const completeBtn=document.createElement（'button'）；
newToDo.innerText=input.value；
removeBtn.innerText='单击以删除'；
completetbtn.innerText='完成后单击'；
新的附录（completeBtn）；
newToDo.appendChild（removeBtn）；
input.value=''；
托多利斯特·阿佩奇尔德（纽托多）；
CompleteTn.addEventListener（“单击”，函数（e）{
e、 target.parentElement.style.textDecoration=“行通过”；
})
removeBtn.addEventListener（“单击”），函数（e）{
e、 target.parentElement.remove（）；
})
})

待办事项清单：


提交

这样做：

const form=document.querySelector（'addToDo'）；
常量输入=document.querySelector（“#theToDo”）；
const todolist=document.querySelector（“#todolist”）；
表.addEventListener（'submit'，函数（e）{
e、 预防默认值（）；
const newToDo=document.createElement（'li'）；
const newtoname=document.createElement（'span'）；
const removeBtn=document.createElement（'button'）；
const completeBtn=document.createElement（'button'）；
newToName.innerText=input.value；
removeBtn.innerText='单击以删除'；
completetbtn.innerText='完成后单击'；
newToDo.appendChild（newtoname）；
新的附录（completeBtn）；
newToDo.appendChild（removeBtn）；
input.value=''；
托多利斯特·阿佩奇尔德（纽托多）；
CompleteTn.addEventListener（“单击”，函数（e）{
newToDo.innerHTML=newtoName.innerText.strike（）；
})
removeBtn.addEventListener（“单击”），函数（e）{
e、 target.parentElement.remove（）；
})
})

待办事项清单：


提交

将您的newToDo附加到todolist，并在单击函数调用时更改innerHtml：

const form = document.querySelector('#addToDo');
const input = document.querySelector('#theToDo');
const todolist = document.querySelector('#todolist');

form.addEventListener('submit', function(e) {
  e.preventDefault();
  const newToDo = document.createElement('li');
  const removeBtn = document.createElement('button');
  const completeBtn = document.createElement('button');
  newToDo.id = 'new_todo';
  newToDo.innerText = input.value;
  removeBtn.innerText = 'Click to Remove';
  completeBtn.innerText = 'Click if Completed';
  todolist.append(newToDo);
  todolist.appendChild(completeBtn);
  todolist.appendChild(removeBtn);
  input.value = '';

  completeBtn.addEventListener("click", function(e) {
    var todo = document.querySelector('#new_todo');
    var todoText = '<del>' + todo.innerText + '</del>';
    todo.innerHTML = todoText;
  })

  removeBtn.addEventListener("click", function(e) {
    e.target.parentElement.remove();
  })
})

const form=document.querySelector（'addToDo'）；
常量输入=document.querySelector（“#theToDo”）；
const todolist=document.querySelector（“#todolist”）；
表.addEventListener（'submit'，函数（e）{
e、 预防默认值（）；
const newToDo=document.createElement（'li'）；
const removeBtn=document.createElement（'button'）；
const completeBtn=document.createElement（'button'）；
newToDo.id='new_todo'；
newToDo.innerText=input.value；
removeBtn.innerText='单击以删除'；
completetbtn.innerText='完成后单击'；
todolist.append（newToDo）；
todolist.appendChild（completeTn）；
todolist.appendChild（removeBtn）；
input.value=''；
CompleteTn.addEventListener（“单击”，函数（e）{
var todo=document.querySelector（'new#u todo'）；
var todoText=''+todo.innerText+''；
todo.innerHTML=todoText；
})
removeBtn.addEventListener（“单击”），函数（e）{
e、 target.parentElement.remove（）；
})
})

请参见此处的工作提示：

为什么您的代码不工作 由于

e.target.newToDo.innerText.strike（）

这不针对

li

（父元素），您的代码无法工作，您需要将

innerText

设置为删除的

innerText

，否则它将不会显示

为什么不应该使用

strike（）

在JS中编辑样式是不好的做法，HTML5不支持

标记

相反，创建如下CSS类：

.strike{
文字装饰：线条贯通；
}

然后将

.strike

类附加到HTML元素

解决方案

const form=document.querySelector（'addToDo'）；
常量输入=document.querySelector（“#theToDo”）；
const todolist=document.querySelector（“#todolist”）；
表.addEventListener（'submit'，函数（e）{
e、 预防默认值（）
todolist.innerHTML+=`

${input.value}
罢工
去除
`
})
函数删除项（ele）{
const itemTextEle=ele.parentElement.querySelector（'span'））
itemTextEle.innerHTML=itemTextEle.innerText.strike（）
}
F