2

我真的需要你的专家帮助！

我正在制作一个展示 HTML 电子邮件的网站。因此，我需要从特定 div 中删除所有样式，以便我可以从电子邮件中复制和粘贴 HTML。这将保持电子邮件的原始设计。

我在这里设置了一个测试页面并尝试使用 jQuery 中的 removeAttr ，但它似乎不起作用。

我对 HTML 和 CSS 编码很好，但 javaScript 对我来说是新的，所以任何非常清晰的例子都会很棒。

顺便说一句，我没有挂断 jQuery。任何能完成这项工作的东西都会很棒！

先谢谢各位了

布伦丹。

这是 JavaSript 和 HTML

<link rel='stylesheet' id='style-css'  href='css/style.css' type='text/css' media='all' />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

</head>

<body>
    <script type='text/javascript'>
        $(document).ready(function() {
    $('h1').removeAttr('style');
    });
</script>
<p>This is a paragraph tag.</p>
<h1>This is a H1 tag.</h1>
<div>
    <p>This is a p tag inside a styled div.</p>
    <table width="200" border="1">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
    <tr>
        <td>7</td>
        <td>8</td>
        <td>9</td>
    </tr>
</table>
</div>
</body>
</html>

这是CSS

table, th, td {
    border: 1px solid #CCCCCC;
}
table {
    margin-bottom: 1.5em;
    max-width: 100%;
    width: 100%;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
p, address {
margin-bottom: 1.5em;
font-size:19px;
}
h1{
    border-bottom: 5px solid #666666;
}
h1{
    font-family: "Oswald";
    line-height: 1.5;
    margin: 0 0 0;
    padding-bottom: 0.3em;
    text-transform: lowercase;
}
h1{
    font-size: 2em;
    line-height: 1;
    margin-bottom: 1em;
}
h1, h2, h3, h4, h5, h6 {
    clear: both;
    font-size: 100%;
    font-weight: normal;
}
div{
    background-color:#9F0;
}
4

3 回答 3

2 
jQuery(function($) {
    $("style, link[rel=stylesheet]").remove();
    $("*").removeAttr("style");
});
于 2012-11-26T20:42:13.003 回答
0

我建议使用 iframe 将您的页面与电子邮件中的 html 隔离开来。如果您从与父页面不同的域中提供电子邮件模板内容，那么恶意内容影响您网站的范围就会更小。

像这样的东西：

<!-- in http://www.company.com/templates/123 -->

<iframe src="http://www.usercontent.com/templates/123.html"></iframe>

如果没有跨域屏障，如果有人设法在模板内执行 javascript，那么它将无法继续窃取您用户的 cookie。然后作为奖励，由于内容将位于不同的页面中，因此不同页面之间的 CSS 混合不会有任何问题。

于 2012-11-26T20:46:41.703 回答
0

我认为您需要的是javascript：

document.getElementById('your_div').style='';
document.getElementById('your_div').setAttribute("class","");
于 2012-11-26T20:42:05.943 回答