Question

我正在编写一个tampermonkey脚本，该脚本可更改其类以“ blocked”开头的元素的样式。所以我有这段代码：

var blockedelements = document.querySelectorAll("[class^=blocked]");
var element = blockedelements[0];
element.style.display="none";

为简单起见，这仅适用于第一个元素，但我知道如何遍历每个元素，并且此代码有效。该webapp使用此类动态创建新元素，我希望脚本为每个新创建的元素执行，这是我不知道该怎么做的。我想要一个纯JS解决方案，而不是jquery。这是听众的目的吗？我对javascript不太了解。

谢谢您的指点，谢谢

Answer 1

您可以使用JavaScript添加页面范围的样式规则以隐藏所有元素，而不是手动更改元素的每个实例的显示值。这样，您就可以让浏览器为您处理将规则应用于元素的现有实例和将来实例的情况。

粗略的想法：

var rule = "[class^=blocked] { display: none }";
var styleElement = document.createElement("style");

styleElement.type = "text/css";

if (styleElement.style.cssText) {
  styleElement.style.cssText = rule;
} else {
  styleElement.appendChild(document.createTextNode(rule));
}

document.getElementsByTagName("head")[0].appendChild(styleElement);

将样式应用于新创建的元素的脚本

1 个答案: