오류

 

NotFoundError

Fail to execute ‘removeChild’ on ‘Node’

Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node.

상황

to do list에 추가된 li 태그를 삭제하려고 하면 해당 오류 발생

해결

function deleteToDo(event) {
  const deleteBtn = event.target;
  const li = deleteBtn.parentNode;
  toDoList.removeChild(li); // 여기서 오류 발생
	...
}
  span.appendChild(deleteBtn);
  span.appendChild(checkBtn);
  li.appendChild(span);
  toDoList.appendChild(li);

아래 코드가 문제가 된 부분이다.
나는 li를 삭제하고 싶었는데, li는 toDoList의 chlid이다. 이 때 deleteBtn과 checkBtn 모두 li에 포함시켜야 했는데, 텍스트(span) 뒤에 버튼을 넣고 싶어서 별 생각없이 span에 포함시켰다.

아래 코드로 고치니 해결되었다.

  li.appendChild(span);
  li.appendChild(deleteBtn);
  li.appendChild(checkBtn);
  toDoList.appendChild(li);