Question

我们目前不得不编写一些将嵌入各种页面的小部件。据我所知，我有两个可能的选项来保护这些小部件免于松散的CSS规则（例如，一般的p { background-color: red }）。这些是：

选项1对我来说是一个已知的实体。它并不漂亮，但它会起作用。选项2我不太确定。会有大量的iframe减慢页面速度吗？我们现在很多旧网站都会访问我们的网站。网速很慢。我们还需要支持旧的IE 8 - 是否存在浏览器兼容性问题？我们当然无法使用较新的iframe属性。

任何人都可以提出任何理由我不应该选择2吗？这听起来更好，但是在打电话之前我还需要更多的指导。

Answer 1

iframes是一个非常古老的功能，因此IE8支持不是问题。主要区别在于iframe将单独的文档加载到框架中。这将产生一些影响：

小部件在单独的请求中加载。它将需要自己的HTML页面，因此您将有一个额外的HTTP请求，以及需要传输的更多数据。
尽管如此，初始页面加载甚至可能更快，因为可以在加载窗口小部件之前显示页面。
iframe是一个边界。 iframe中的页面无法修改iframe之外的元素。这可能是一个优势（由于安全风险而无法访问的第三方横幅/小部件）或缺点（如果您希望自己的小部件可以访问父级）。
因为它是一个单独的页面，所以它有自己的CSS集，并且不受父页面影响的任何方式（除了宽度/高度）。这也是一个优点或缺点。您可以完全控制窗口小部件的外观，但很难为窗口小部件的用户/实现者提供额外的样式。

Answer 2

如果您关心CSS属性，则可以使用样式表或样式DOM属性中更具体的规则为该属性设置样式。无论哪种方式，它都会覆盖松散的选择器。

如果您不关心CSS属性，重置它是没有意义的，您应该允许它以主题为主。