如何防止查询被加载到整个页面加载css？

我从外部php文件加载内容并将其插入使用查询的$ .get功能。包含的文件包含各种CSS类。例如，设置超链接的样式。当文件加载和jQuery插入的内容时，CSS样式不仅适用于新内容，还适用于整个页面。详细说明，我正在加载html电子邮件的内容。在电子邮件内容是css风格超链接在电子邮件消息。消息内容使用php脚本从服务器中检索并回显。 jQuery的会从PHP脚本返回的内容，并把它放在div的内部HTML：如何防止查询被加载到整个页面加载css？

$.get("file.php",function(data){ $("#div").html(data); });

但在电子邮件内容的CSS（由file.php返回）被应用到整个页面，更换款式上我自己的超链接。我怎样才能防止新的css被应用到整个页面，并且只适用于div容器中新加载的内容而不改变页面的原始css的其余部分？

来源

2013-12-12 Peter Cullen

你可以改变div＃＃div吗？ –

不知道我明白了，样式标签只能存在于头部部分中，您是否在您的页面中加载了另一个头部部分，或者这些全局样式究竟应用了多少？ – adeneo

可以解析响应并只将正文内容加载到您的页面中，并使用您的CSS来设置其内容的样式 – charlietfl

2个可能的解决方案。

1）尝试使用iframe，并使用CSS和HTML填充其内容。

2）也许尝试添加一个带有ID的包装，然后将ID预先添加到CSS中的所有定义中？

EX：

<div id="emailWrapper"> 
... Email Content/CSS ... 
</div>

CSS（前）：

.someClass { 
    .. attributes .. 
}

CSS（后）：

#emailWrapper .someClass { 
    .. attributes .. 
}

来源

2013-12-12 00:20:04 werm098

我不喜欢框架，因为我认为他们是一个混乱的用户界面和风格的吸引力，但我认为这将是最简单，更重要的是，最可靠和兼容的解决方案。有趣的事情大脑的想法，并没有想到... –

这是目前不可能在一个跨浏览器兼容的方式，而不使用一个iframe。在未来，你将能够使用范围的样式（but not yet）是这样的：

<div> 
    <style scoped> 
    p { color:green; } 
    </style> 
    <p>This text is green</p> 
</div> 
<p>This text is the default color</p>

这也将是可能的（以完全不同的方式）与Shadow DOM and templates，但同样，not yet和not yet。

来源

2013-12-12 00:27:09

如何防止查询被加载到整个页面加载css？

回答

相关问题