时间戳

首页 > 解决方案 > 简明扼要地删除一个 DOM 元素（如果存在）？

javascript - 简明扼要地删除一个 DOM 元素（如果存在）？

问题描述

我目前正在编写一个浏览器脚本（用于 Tampermonkey/Greasemonkey）（并在此过程中学习 JS！），我有很多这样的事件：

let btn = document.querySelector("#unwantedButton");
if (btn) {
    btn.parentNode.removeChild(btn);
}

也就是说，我希望删除某个元素，如果它存在的话。

有什么方法可以更简洁优雅地写这个吗？这将在这个项目中为我节省很多行，最重要的是，教我一些 JS 最佳实践。:-)

感谢您帮助 JS 菜鸟！

标签： javascriptdomremovechild

解决方案

与其在几个地方重写代码，不如将它放在一个函数中（并使用remove()：

function removeIfExists (selector) {
  var x = document.querySelector(selector)
  if (x) x.remove()
}

然后你可以到处调用它：

removeIfExists("#some-unwanted-element")

如果您有不想要的已知元素列表，也可以使用它：

var badElements = [ ".foo", "#bar", "#etc" ]
badElements.forEach(removeIfExists)

推荐阅读