附加到 HTML 元素时出现转义字符

Question

我正在通过 AJAX 调用获取 HTML 代码，然后 将代码附加到现有的 HTML 元素 。问题是，附加代码包含转义字符，导致 HTML 中断 ，并导致随机元素看起来像这样：Contact Us ▸<\/a><\/li>\n：

HTML 元素是：<li class="listitems"><a href="https:\/\/website.com\/contact" class="listlinks">Contact Us ▸<\/a><\/li>\n</a></li>

作为参考，收到的 ajax 响应是：

"<li class='listitems'><a href='https:\/\/website.com\/contact' class='listlinks'>Contact Us &rtrif;<\/a><\/li>\n"

用于将此添加到现有 ul 元素的 JavaScript 代码是：

let r = httpRequest.responseText; // The AJAX response
document.getElementById('mylist').insertAdjacentHTML("beforeend",r);

我也试过使用以下方法：

let r = httpRequest.responseText; // The AJAX response
document.getElementById('mylist').interHTML += r;

但我观察到相同的结果。

但是，当我在浏览器的控制台中尝试 JavaScript 代码时 ：我得到了预期的结果：联系我们 ▸

而 HTML 元素是：<li class="listitems"><a href="https://website.com/contact" class="listlinks">Contact Us ▸</a></li>

我无法理解为什么代码没有被正常转义和评估为HTML，但是当我使用浏览器的控制台手动执行时它有效window.

谁能告诉我这里遗漏了什么以及如何解决这个问题？

Answer 1

响应为JSON，需要解析

let responseText = `"<li class='listitems'><a href='https:\/\/website.com\/contact' class='listlinks'>Contact Us &rtrif;<\/a><\/li>\n"`;
let r = JSON.parse(responseText);
document.getElementById('mylist').insertAdjacentHTML("beforeend",r);

<ul id="mylist">
</ul>

附加到 HTML 元素时出现转义字符

Escaped characters appearing when appending to HTML element

javascript

html

ajax

escaping