javascript 如何删除一个节点并保留节点内的所有内容，包括其子节点的所有事件

怎么做到只删除下方 .child标签，并且保留里面所有的内容和事件

<!DOCTYPE html>
<html lang="en">
<body>
    
    <div class="father">
        文字把节点包围了起来<div class="child">子节点的文字<span>123</span>子节点的文字</div>文字把节点包围了起来
    </div>

    <script>
        document.getElementsByTagName('span')[0].addEventListener('click',()=>{
            console.log('保留span的事件')
        })

        //在下方写具体实现逻辑
         .....
    </script>
</body>
</html>

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除
收藏举报

3条回答默认最新

在下月亮有何贵干前端领域优质创作者 2021-09-09 17:19

关注

答应我，以后不要有这么奇怪的要求好吗

    const child = document.getElementsByClassName("child")[0];
    const father = document.getElementsByClassName("father")[0];
    document.getElementsByTagName("span")[0].addEventListener("click", () => {
      console.log("保留span的事件");
      const childInner = child.innerHTML;
      const childOuter = child.outerHTML;
      const fatherInner = father.innerHTML;
      father.innerHTML = fatherInner.replace(childOuter, childInner);
    });