要在JavaScript中转义HTML实体吗？

一尘不染

要在JavaScript中转义HTML实体吗？

javascript

我有一些与XML-RPC后端通信的Javascript代码。XML-RPC返回以下形式的字符串：

<img src='myimage.jpg'>

但是，当我使用Javascript将字符串插入HTML时，它们将按字面显示。我没有看到图片，我从字面上看到了字符串：

<img src='myimage.jpg'>

我的猜测是HTML正在通过XML-RPC通道进行转义。

如何取消对Javascript中的字符串的转义？我尝试了此页面上的技术，但未成功：http :
//paulschreiber.com/blog/2008/09/20/javascript-how-to-unescape-html-
entities/

还有什么其他方法可以诊断问题？

阅读 264

2020-04-23

共1个答案

一尘不染

编辑：
您应该按照Wladimir的建议使用DOMParser API，因为发布的函数引入了安全漏洞，所以我编辑了以前的答案。

以下代码片段是旧答案的代码，但进行了少量修改：使用a textarea代替a div可以减少XSS漏洞，但是在IE9和Firefox中仍然存在问题。

function htmlDecode(input){
  var e = document.createElement('textarea');
  e.innerHTML = input;
  // handle case of empty input
  return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}

htmlDecode("&lt;img src='myimage.jpg'&gt;"); 
// returns "<img src='myimage.jpg'>"

基本上，我以编程方式创建DOM元素，将编码的HTML分配给它的innerHTML，并从在innerHTML插入上创建的文本节点中检索nodeValue。由于它只是创建一个元素而从不添加它，因此不会修改网站HTML。

它可以跨浏览器（包括较旧的浏览器）运行，并接受所有HTML字符实体。

编辑：此代码的旧版本不适用于带有空白输入的IE，如jsFiddle（在IE中查看）所示。上面的版本适用于所有输入。

更新：看来这不适用于大字符串，并且还引入了一个 安全漏洞 ，请参阅注释。

2020-04-23