3

我有通过 AJAX 以下列格式返回的输出（#the-poll-options作为插入 AJAX 的容器）。

<div id="the-poll-options">
    <div class="error-output">
        <p>Blah, blah, bla, etc, etc.</p>
    </div>
</div>

我需要插入一个标题来指示错误 -

<div id="the-poll-options">
    <div class="error-output">
        <h3>An error has occurred</h3>
        <p>Blah, blah, bla, etc, etc.</p>
    </div>
</div>

为此，我使用了以下 CSS。这在一定程度上有效，但实际上是输出<h3>An error has occurred</h3>，而不是将其解释为 HTML。

#the-poll-options .error-output:before{
    content: '<h3>An error has occured</h3>';
}

是否可以使用纯 CSS 来做到这一点，而无需使用 JS？请注意，我无法更改 AJAX 调用返回的 HTML。谢谢。

4

4 回答 4

1

既然您仍然使用 JS 来执行 Ajax 调用，为什么不在 Ajax 成功函数中创建那个 h3 呢？

于 2013-10-23T15:43:49.977 回答
1

你不能在h3那里创建，但你可以像以前一样格式化它h3。但是，您必须重复所有格式规则。

#the-poll-options .error-output:before{
    content: 'An error has occured';
    font-weight: bold;
    font-size: 14px;
    color: red;
    ...
}

此类中的样式定义:before将应用于添加的内容。

于 2013-10-23T15:47:08.727 回答
0

你不能。与content您只能添加文本。这是一个类似的问题，您可能会觉得有帮助：LINK

于 2013-10-23T15:42:04.880 回答
0

如前所述，您不能使用伪元素添加 HTML

你可以试试这个

HTML

<div id="the-poll-options">
    <div class="error-output">
        <h3></h3>
        <p>Blah, blah, bla, etc, etc.</p>
    </div>
</div

>

CSS

#the-poll-options .error-output h3:before{
    content: 'An error has occured';
}
于 2013-10-23T15:43:21.397 回答