Javascript 防止注入的HTML获取网站的CSS

我正在为FF和Chrome做一个简单的扩展，之后会在页面顶部插入一个。问题是一些网站对按钮或边框等有全局CSS规则。例如：

button, input[type="button"], input[type="submit"] { 
    color:#050; 
    font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
    background-color:#fed; 
    border:1px solid; 
    border-color: #696 #363 #363 #696; 
} 

我希望注入的div中的按钮和其他元素只使用它们类中的CSS，而不使用其他内容。有没有可能让这些元素拒绝外来CSS

---

谢谢。

因为您正在向DOM中注入代码，所以HTML受任何适用于它的CSS的约束

我建议您只需使用一个唯一的ID来覆盖注入的DIV的CSS

HTML:

如果你真的想确定，你可以申请！强制和强制CSS很重要

#uniqueIdThatNobodyWouldUse input {
    color:#000 !important;
    font: bold 84% 'trebuchet ms',helvetica,sans-serif !important; 
    background-color:#fed !important; 
    border:1px solid !important;
    border-color: #696 #363 #363 #696 !important; 

}

---

将它放在iframe中修复它

临时修复方法是编写内联CSS，它将覆盖网页上的CSS。我会寻找更好的答案，然后再给你回复。@kiran.koduru X它仍然会从CSS@u好主意！没有想到这个选项。插入一个iframe，然后将您的小部件加载到iframe中。将iframes css设置为none要比设置一堆元素容易得多。可能是重复的，但我的输入仍然会使用我的uniqueID css中没有提到的其他css规则，对吗？例如：填充、宽度等，这就是为什么您应该完全覆盖所有您需要的内容，以确保它看起来正确。没有拒绝外来CSS选项。

#uniqueIdThatNobodyWouldUse input {
    color:#000; 
    font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
    background-color:#fed; 
    border:1px solid; 
    border-color: #696 #363 #363 #696; 

}

#uniqueIdThatNobodyWouldUse input {
    color:#000 !important;
    font: bold 84% 'trebuchet ms',helvetica,sans-serif !important; 
    background-color:#fed !important; 
    border:1px solid !important;
    border-color: #696 #363 #363 #696 !important; 

}