javascript - 从元素中删除/重置继承的 css

Question

我知道这个问题之前有人问过，但在将其标记为重复之前，我想告诉你，我的情况与我在互联网上找到的情况有些不同。

我正在构建和嵌入脚本，人们可以将其放在自己的网站上。此脚本创建一个具有特定宽度/高度和其中一些信息的 div。

我的问题是某些网站声明的 div 样式也被我的 div 继承。

例如:

div{
    background-color:red;
}

所以如果我没有为我的 div 设置任何背景颜色，即使我不想要它也会显示红色。

我遇到的唯一解决方案是覆盖尽可能多的 css 属性，这样我的 div 就会完全按照我的意愿显示。这个解决方案的问题是有太多的 css 属性需要覆盖，我希望我的脚本尽可能轻。

所以我的问题是您是否知道我的问题的另一种解决方案。它可以在 css/javascript/jQuery 中。

谢谢

Answer 1

“重置”特定元素的样式是不可能的，您必须覆盖所有您不想要/不需要的样式。如果您直接使用 CSS 或使用 JQuery 来应用样式(取决于对您来说哪个更容易，但我不建议为此使用 JavaScript/JQuery，因为它完全没有必要)。

如果您的 div 是某种可以包含在其他站点中的“小部件”，您可以尝试将其包装到 iframe 中。 .这将“重置”样式，因为它的内容是另一个文档，但这可能会影响您的小部件的工作方式(或者可能会完全破坏它)，因此在您的情况下这可能是不可能的。