Question

只是想在div中写一个原始的html，但是有些研究让我感到困惑。

使用ajax（xhr）从服务器向客户端发送字符串：

<p:selectBooleanCheckbox itemLabel="Compare" value="#{compare.checkCompare}">
<f:param name = "id2" value="#{camp.campID}" />
<p:ajax listener="#{compare.compare()}" />
</p:selectBooleanCheckbox>

并使用以下命令将其放入div中：

"&lt;p&gt;123&lt;/p&gt;"

但它没有显示结果：我的页面上显示123：

var xhr = $.ajax({
    url: "/GetData",
    type: 'POST',
    dataType: 'json',
    data: inputParams,
    contentType: 'application/json; charset=utf-8',
    success: function (msg) {

      //msg is &lt;p&gt;123&lt;/p&gt;
      $('#testdiv').html($.parseHTML(msg));

    },
    error: function (xhr) {

    }
});

我测试了此命令，但没有用：

<p>123</p>

更新：经过一些测试，我发现如果我发送

//msg is &lt;p&gt;123&lt;/p&gt;

$('#testdiv').html(msg));

$('#testdiv').html($.parseHTML(msg));

但是如果我发送

 "&lt;p&gt;123&lt;/p&gt;"   the result will be  <p>123</p>

Answer 1

var msg = "&lt;b&gt;123&lt;/b&gt;";
$('#testdiv').html($('<textarea />').html(msg).text());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="testdiv"></div>

说明：

您尝试使用parseHTML将非html字符串解析为html，并且由于（非html）字符串包含html实体，因此该字符串刚刚被解码。我们首先必须将字符串解码为javascript中的html友好字符，然后解析HTML。

$('<textarea />').html(msg).text()

这会导致新的/临时元素（html()）的<textarea/>不会打印到任何实际的DOM element中，导致jQuery将其解码为HTML，然后与{ {1}}。

如何使用jQuery在div内编写原始HTML？

1 个答案: