Question

我正在开发使用HTML和JS的ToDo应用程序，但无法移除动态添加的元素。有什么办法可以删除所选元素？

我试图通过选择元素的父元素然后再到达子元素并将其删除来删除元素。但是，无法安排删除所选元素。 el.removeChild(el.childNodes[0])从头开始删除元素。有什么办法可以删除选定的活动元素？

document.addEventListener('click',function(e){
  if(e.target && e.target.id== 'rem'){
    let el = document.getElementById('uList');
    el.removeChild(el.childNodes[0]); // How to remove the clicked el?
   }
});

我希望代码删除被单击的元素，而不是删除从0元素开始的节点。

非常感谢！

Answer 1

document.addEventListener('click', function(e) {
    if (!e.target || e.target.id !== 'rem') {
        return;
    }
    let parent = e.target.parentElement;
    if (!!parent) {
        parent.removeChild(e.target);
    }
});

对于父母的父母：

document.addEventListener('click', function(e) {
    if (!e.target || e.target.id !== 'rem') {
        return;
    }
    const parent = e.target.parentElement;
    if (!parent) {
        return;
    }
    const parentOfParent = parent.parentElement;
    parent.removeChild(e.target);
    if (!!parentOfParent) {
        parentOfParent.removeChild(parent);
    }
});

如何通过动态添加的元素正确处理事件？

1 个答案: