Javascript 如何使用jQuery解码HTML实体？

如何使用jQuery对字符串中的HTML实体进行解码？

我认为您混淆了文本和HTML方法。看看这个例子，如果您使用元素的内部HTML作为文本，您将得到解码的HTML标记（第二个按钮）。但是如果您将它们作为HTML使用，您将得到HTML格式的视图（第一个按钮）

下面是一个HTML内容。





结果在这里！

第一个按钮写着：这里是一个HTML内容

第二个按钮写道：这是一个HTML内容

顺便说一下，您可以看到我在中找到的一个插件，它对HTML字符串进行编码和解码。

使用

myString = myString.replace( /\&/g, '&' );

在服务器端这样做是最容易的，因为显然JavaScript没有用于处理实体的本机库，在扩展JavaScript的各种框架的搜索结果顶部附近也没有找到任何本机库

搜索“JavaScript HTML实体”，您可能会找到一些用于此目的的库，但它们可能都是围绕上述逻辑构建的-逐个实体替换。

无需任何jQuery：

函数解码实体（encodedString）{
var textArea=document.createElement（'textArea'）；
textArea.innerHTML=encodedString；
返回textArea.value；
}
console.log（解码实体（'1&；2'））；/'1和2'

安全注意事项：使用此答案（保留在下面的原始形式）可能会在应用程序中引入错误您不应使用此答案。阅读此答案中漏洞的解释，然后使用该答案中的方法或替代方法

实际上，试试看

var encodedStr=“这很有趣”；
var decoded=$（“”）.html（encodedStr.text（）；
控制台日志（已解码）
我只需要一个HTML实体字符(⇓) 作为HTML按钮的值。HTML代码在浏览器中从一开始就看起来不错：

<input type="button" value="Embed & Share  &dArr;" id="share_button" />



现在我添加了一个开关，它也应该显示字符。这是我的解决方案

$("#share_button").toggle(
    function(){
        $("#share").slideDown();
        $(this).attr("value", "Embed & Share " + $("<div>").html("&uArr;").text());
    }

$（“#共享按钮”）。切换(
函数（）{
$（“#共享”）.slideDown（）；
$（this.attr（“value”，“Embed&Share”+$（“”）html（“&uArr；”）text（））；
}

这显示⇓ 再次点击按钮。我希望这可能会对某人有所帮助。
这个问题受到“使用jQuery”的限制，但它可能会帮助一些人知道，在这里的最佳答案中给出的jQuery代码在下面做了以下工作……这在使用或不使用jQuery时都有效：

function decodeEntities(input) {
  var y = document.createElement('textarea');
  y.innerHTML = input;
  return y.value;
}

要使用jQuery解码HTML实体，只需使用以下函数：

function html_entity_decode(txt){
    var randomID = Math.floor((Math.random()*100000)+1);
    $('body').append('<div id="random'+randomID+'"></div>');
    $('#random'+randomID).html(txt);
    var entity_decoded = $('#random'+randomID).html();
    $('#random'+randomID).remove();
    return entity_decoded;
}

Ext.util.Format.htmlDecode(innerHtmlContent)

HTML:

var txtEncoded = "&aacute; &eacute; &iacute; &oacute; &uacute;";
$('#some-id').val(html_entity_decode(txtEncoded));

<input id="some-id" type="text" />

正如Mike Samuel所说，不要使用jQuery.html（）.text（）来解码html实体，因为这是不安全的

相反，请使用类似@VyvIT注释的或来自@VyvIT注释的模板渲染器

实用工具带库附带了
escape
和
unescape
方法，但它们对于用户输入不安全：


您必须为html实体创建自定义函数：

function htmlEntities(str) {
return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g,'&gt;').replace(/"/g, '&quot;');
}

函数属性（str）{
返回字符串（str）.replace（//&/g，“&；”）.replace（//g，”）.replace（//“/g，”）；
}
最简单的方法是为元素设置一个类选择器，然后使用以下代码：

$(function(){
    $('.classSelector').each(function(a, b){
        $(b).html($(b).text());
    });
});

再也不需要了

我遇到了这个问题，找到了这个清晰的解决方案，效果很好。
我认为这与选择的解决方案正好相反

var decoded = $("<div/>").text(encodedStr).html();

var decoded=$（“”）.text（encodedStr.html（）；
您可以使用he库，可从

例如：

console.log(he.decode("J&#246;rg &amp J&#xFC;rgen rocked to &amp; fro "));
// Logs "Jörg & Jürgen rocked to & fro"

关于是否有任何理由在客户端代码中使用此库以支持此处和其他地方提供的
黑客攻击的问题，我提出了一些可能的理由：


如果您使用的是node.js服务器端，那么使用HTML编码/解码库可以为您提供一个既适用于客户端又适用于服务器端的单一解决方案

某些浏览器的实体解码算法存在错误或缺少对某些实体的支持。例如，Internet Explorer将正确解码和呈现非中断空格（
），但通过DOM元素的
innerText
属性将其报告为普通空格，而不是非非中断空格，从而中断
破解此外，IE 8和9只是HTML 5中添加的任何新命名字符引用。他的作者还主持了命名字符引用支持测试。在IE 8中，它报告了1000多个错误

如果您想避免与实体解码相关的浏览器错误，并且/或者能够处理所有命名字符引用，那么您就无法摆脱
黑客攻击；您需要一个像他这样的库

他只是觉得用这种方式做事没那么烦人

编码：


$（“”）.html（“”）.html（）；//返回'a>'
假设您有以下字符串

我们的豪华客舱温暖、舒适、舒适

var str = $("p").text(); // get the text from <p> tag
$('p').html(str).text();  // Now,decode html entities in your variable i.e 

var str=$（“p”）.text（）；//从标记获取文本
$（'p'）.html（str）.text（）；//现在，解码变量中的html实体，即

str并分配回标记

对于Extjs用户，如果已经有编码的字符串，例如当库函数的返回值是内含HTML内容时，请考虑这个Extjs函数：

function html_entity_decode(txt){
    var randomID = Math.floor((Math.random()*100000)+1);
    $('body').append('<div id="random'+randomID+'"></div>');
    $('#random'+randomID).html(txt);
    var entity_decoded = $('#random'+randomID).html();
    $('#random'+randomID).remove();
    return entity_decoded;
}

Ext.util.Format.htmlDecode(innerHtmlContent)

扩展字符串类：

String::decode = ->
  $('<textarea />').html(this).text()

还有一个问题：
转义字符串在指定给输入值时看起来不可读

var string = _.escape("<img src=fake onerror=alert('boo!')>");
$('input').val(string);

var-string=\u0.escape（“”）；
$（'input'）.val（字符串）；

例如：
或者，这里也有一个图书馆

这里,

干杯。
试试这个：


var htmlEntities=“scriptalert（'hello'）；/script”；
var htmlDecode=$.parseHTML（htmlEntities）[0]['wholeText']；
console.log（htmlDecode）；
您不需要jQuery来解决这个问题，因为它
npm install he                 //using node.js

<script src="js/he.js"></script>  //or from your javascript directory

//to encode text 
he.encode('© Ande & Nonso® Company LImited 2018');  

//to decode the 
he.decode('&copy; Ande &amp; Nonso&reg; Company Limited 2018');