Javascript用于删除模糊网站的DIV

Question

有一个网站，div:

<div class="x" style="user-select: none; filter: blur(4px);">

在这个div下面有很多其他div。我想知道是否有可能只删除这个DIV与javascript。所以只有那个被删除了下面所有的div都保留了。

我想摆脱这个DIV，因为这个DIV模糊了网站文本的一部分。仅仅改变模糊(4px)是行不通的，网站有某种保护，它会把这个部分刷新回原来的样子。我在javascript中寻找可能性的原因是因为我想在浏览器中自动执行此操作。(开发者模式下手动删除DIV即可)

到目前为止，我得到了以下内容:

var div = document.getElementsByClassName('page-content');
div.remove();  //(but this does not work)

Answer 1

getElementsByClassName()返回一个集合。只有单个对象有remove()方法。您必须应用以下其中一个:

1. 使用括号指定要获取的对象的索引:

div[0].remove()

2. 也使用item()方法传递索引:

div.item(0).remove()

两种方式都是等价的。

作为替代，您可以调用querySelector()方法:

const div = document.querySelector('.page-content')

它返回一个对象(根据传入的CSS选择器)，所以你可以使用:

div.remove()

编辑:

要只删除覆盖的div，您可以使用replaceWith()方法并将该div的子节点作为参数传递:

div.replaceWith(...div.childNodes)

如果你想只保留元素节点，使用childrenproperty:

div.replaceWith(...div.children)