假设我从一个服务请求中得到了一些JSON，看起来像这样:
{
"message": "We're unable to complete your request at this time."
}
我不知道为什么那个撇号是这样编码的(');我只知道我想解码它。
下面是我突然想到的一个使用jQuery的方法:
function decodeHtml(html) {
return $('<div>').html(html).text();
}
不过，这似乎(非常)俗气。还有什么更好的办法吗?有“正确”的方法吗?
当前回答
jQuery将为您编码和解码。
function htmlDecode(value) { return $("<textarea/>").html(value).text(); } function htmlEncode(value) { return $('<textarea/>').text(value).html(); } <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(document).ready(function() { $("#encoded") .text(htmlEncode("<img src onerror='alert(0)'>")); $("#decoded") .text(htmlDecode("<img src onerror='alert(0)'>")); }); </script> <span>htmlEncode() result:</span><br/> <div id="encoded"></div> <br/> <span>htmlDecode() result:</span><br/> <div id="decoded"></div>
其他回答
如果你不想使用html/dom，你可以使用regex。我还没有测试过;但是有些事情是这样的:
function parseHtmlEntities(str) {
return str.replace(/&#([0-9]{1,3});/gi, function(match, numStr) {
var num = parseInt(numStr, 10); // read num as normal number
return String.fromCharCode(num);
});
}
(编辑)
注意:这只适用于数值型的html实体，而不是像&oring这样的东西。
[编辑2]
修正了函数(一些错别字)，测试在这里:http://jsfiddle.net/Be2Bd/1/
这是一个很好的答案。你可以像这样使用angular:
moduleDefinitions.filter('sanitize', ['$sce', function($sce) {
return function(htmlCode) {
var txt = document.createElement("textarea");
txt.innerHTML = htmlCode;
return $sce.trustAsHtml(txt.value);
}
}]);
如果您关心遗留兼容性，就不要使用DOM来完成此操作。使用DOM解码HTML实体(如目前接受的答案所建议的那样)会导致非现代浏览器上跨浏览器结果的差异。
对于根据HTML标准中的算法解码字符引用的健壮且确定的解决方案，请使用he库。从它的自述:
he(代表“HTML实体”)是一个用JavaScript编写的健壮的HTML实体编码器/解码器。它支持HTML中所有标准化的命名字符引用，像浏览器一样处理不明确的&号和其他边缘情况，有一个广泛的测试套件，而且——与许多其他JavaScript解决方案相反——他很好地处理了星界Unicode符号。有一个在线演示。
下面是你如何使用它:
he.decode("We're unable to complete your request at this time.");
→ "We're unable to complete your request at this time."
声明:我是该图书馆的作者。
有关更多信息，请参阅Stack Overflow的回答。
jQuery将为您编码和解码。
function htmlDecode(value) { return $("<textarea/>").html(value).text(); } function htmlEncode(value) { return $('<textarea/>').text(value).html(); } <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(document).ready(function() { $("#encoded") .text(htmlEncode("<img src onerror='alert(0)'>")); $("#decoded") .text(htmlDecode("<img src onerror='alert(0)'>")); }); </script> <span>htmlEncode() result:</span><br/> <div id="encoded"></div> <br/> <span>htmlDecode() result:</span><br/> <div id="decoded"></div>
有一个JS函数来处理&#xxxx样式的实体: 函数在GitHub
// encode(decode) html text into html entity var decodeHtmlEntity = function(str) { return str.replace(/&#(\d+);/g, function(match, dec) { return String.fromCharCode(dec); }); }; var encodeHtmlEntity = function(str) { var buf = []; for (var i=str.length-1;i>=0;i--) { buf.unshift(['&#', str[i].charCodeAt(), ';'].join('')); } return buf.join(''); }; var entity = '高级程序设计'; var str = '高级程序设计'; let element = document.getElementById("testFunct"); element.innerHTML = (decodeHtmlEntity(entity)); console.log(decodeHtmlEntity(entity) === str); console.log(encodeHtmlEntity(str) === entity); // output: // true // true <div><span id="testFunct"></span></div>
