JS实现HTML标签转义及反转义

Posted toyoung

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS实现HTML标签转义及反转义相关的知识,希望对你有一定的参考价值。

今天我用ueditor时候遇到一个问题:

  我从数据库中读取内容进行编辑的时候,不是有一些html标签嘛,从数据库读出来没有问题;

  但是我用asp.net mvc,把读取出来的内容通过ueditor的api方法赋值到编辑区域的时候html标签被转义了;

  比如<变为了&lt;

 

  我跟踪代码看后端取到的数据没有问题,返回到前端的时候html标签页都正常可以看到,但就是在js中直接被转义了,我还是不死心啊,先在后端用html编码一次,用HttpUtility.HtmlEncode方法编码一次,在Razor中再使用一次HtmlDecode,还是不能解决问题;

  由此可以看出确实是浏览器端自己转义了,大概是由于各种安全原因吧;只能上网找代码了,通过js对html转义和反转义,找到了如下代码:

function HTMLEncode(html) {
    var temp = document.createElement("div");
    (temp.textContent != null) ? (temp.textContent = html) : (temp.innerText = html);
    var output = temp.innerHTML;
    temp = null;
    return output;
}

function HTMLDecode(text) { 
    var temp = document.createElement("div"); 
    temp.innerHTML = text; 
    var output = temp.innerText || temp.textContent; 
    temp = null; 
    return output; 
} 

由此解决了问题!非常感谢这位博主的代码!

引用代码的地址:http://blog.600km.xyz/2015/12/15/js-encode-html-tags/

以上是关于JS实现HTML标签转义及反转义的主要内容,如果未能解决你的问题,请参考以下文章

JS实现HTML标签转义及反转义

JS实现HTML标签转义及反转义

js转义和反转义html

html转义/反转义

javascript对HTML的特殊字符的转义与反转义

StringEscapeUtils类的转义与反转义方法