1.背景:在项目中,经常遇到一些字符需要进行转义后才能显示到界面上,如“&”,在界面中显示的是“&”,在html中书写“&”,显示在界面的中的依然是“&”。

    这时候,就需要进行转义

2.解决方案

<script>
var HtmlUtil = {
/*1.用浏览器内部转换器实现html转码*/
htmlEncode:function (html){
//1.首先动态创建一个容器标签元素,如DIV
var temp = document.createElement ("div");
//2.然后将要转换的字符串设置为这个元素的innerText(ie支持)或者textContent(火狐,google支持)
(temp.textContent != undefined ) ? (temp.textContent = html) : (temp.innerText = html);
//3.最后返回这个元素的innerHTML,即得到经过HTML编码转换的字符串了
var output = temp.innerHTML;
temp = null;
return output;
},
/*2.用浏览器内部转换器实现html解码*/
htmlDecode:function (text){
//1.首先动态创建一个容器标签元素,如DIV
var temp = document.createElement("div");
//2.然后将要转换的字符串设置为这个元素的innerHTML(ie,火狐,google都支持)
temp.innerHTML = text;
//3.最后返回这个元素的innerText(ie支持)或者textContent(火狐,google支持),即得到经过HTML解码的字符串了。
var output = temp.innerText || temp.textContent;
temp = null;
return output;
},
/*3.用正则表达式实现html转码*/
htmlEncodeByRegExp:function (str){
var s = "";
if(str.length == 0) return "";
s = str.replace(/&/g,"&");
s = s.replace(/</g,"<");
s = s.replace(/>/g,">");
s = s.replace(/ /g," ");
s = s.replace(/\'/g,"'");
s = s.replace(/\"/g,""");
return s;
},
/*4.用正则表达式实现html解码*/
htmlDecodeByRegExp:function (str){
var s = "";
if(str.length == 0) return "";
s = str.replace(/&/g,"&");
s = s.replace(/</g,"<");
s = s.replace(/>/g,">");
s = s.replace(/ /g," ");
s = s.replace(/'/g,"\'");
s = s.replace(/"/g,"\"");
return s;
}
};
</script>

使用方法:HtmlUtil.htmlDecodeByRegExp("&amp;")

参考:

http://blog.csdn.net/u013026207/article/details/53994032

https://www.cnblogs.com/leejersey/p/4568092.html

javascript对HTML字符转义与反转义的更多相关文章

  1. 【JavaScript框架封装】JavaScript中的文本字符串的转义和反转义的实现

    如果是想把本地的一个字符串串存到服务器,再次取出来的还是文本的话,就需要这个文本字符串的转义: /** * 对一个字符串的转义 * @param str * @return {*} */ functi ...

  2. JS对HTML实体字符转义和反转义

    一.名词解释 HTML实体字符: 由于在HTML中有些符号是预留的,比如在html中不能直接使用尖括号(‘<’或‘>’),会被误认为标签符号.所以需要通过HTML实体字符去进行替换: HT ...

  3. js转义和反转义html

    本文地址: http://www.cnblogs.com/daysme/p/7100553.html 下面的代码网上常用有,但不是想要的. JS实现HTML标签转义及反转义 http://blog.c ...

  4. js转义和反转义html htmlencode htmldecode

    文章目录 JS实现HTML标签转义及反转义 用Javascript进行HTML转义 1.HTML转义 2.反转义 3.一个有意思的认识 4.完整版本的代码 其他 [转义字符]HTML 字符实体< ...

  5. 使用StringEscapeUtils转义、反转义字符串

    使用commmons-lang.jar中的字符串转义工具类org.apache.commons.lang.StringEscapeUtils转义.反转义字符串,支持CSV.HTML.JAVA.Java ...

  6. 利用StringEscapeUtils对字符串进行各种转义与反转义(Java)

    apache工具包common-lang中有一个很有用的处理字符串的工具类,其中之一就是StringEscapeUtils,这个工具类是在2.3版本以上加上的去的,利用它能很方便的进行html,xml ...

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

    今天我用ueditor时候遇到一个问题: 我从数据库中读取内容进行编辑的时候,不是有一些html标签嘛,从数据库读出来没有问题: 但是我用asp.net mvc,把读取出来的内容通过ueditor的a ...

  8. 使用StringEscapeUtils对Java中特殊字符进行转义和反转义

    https://blog.csdn.net/zdx1515888659/article/details/84966214 Java中转义字符反斜杠 \ 的代替方法 | repalceAll 内涵解析 ...

  9. Java - 利用StringEscapeUtils对字符串进行各种转义与反转义

    来自:http://blog.csdn.net/chenleixing/article/details/43456987 --------------------------------------- ...

  10. 【Java----字符串转义与反转义】

    apache工具包common-lang中有一个很有用的处理字符串的工具类,其中之一就是StringEscapeUtils,这个工具类是在2.3版本以上加上的去的,利用它能很方便的进行html,xml ...

随机推荐

  1. 用Hadoop,还是不用Hadoop?

    本文由 伯乐在线 - Lex Lian 翻译.英文出处:Anand Krishnaswamy.欢迎加入翻译小组. Hadoop通常被认定是能够帮助你解决所有问题的唯一方案. 当人们提到“大数据”或是“ ...

  2. JDBC_时间处理_Date_Time_Timestamp区别_随机日期生成

    import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement;import ...

  3. ionic4 refresh组件位置变更:Ignored attempt to cancel a touchmove event with cancelable=false

    io3 中 refresh组件位置可不定: io4 中 须置顶,否则报错,此外complete方法的调用位置改为target属性 参考:https://github.com/ionic-team/io ...

  4. jeesite 的提示消息图标

    jeesite  的提示消息图标 jeesite 框架的提示信息 保存数据时 总是显示一个叉子图标 不符合要求 原因: 不加成功两字:如下 后来大神说 保存数据提示语句必须加“”“成功” 才会出现正确 ...

  5. java线程面试

    1) 什么是线程? 线程是操作系统能够进行运算调度的最小单位,它被包含在进程之中,是进程中的实际运作单位.程序员可以通过它进行多处理器编程,你可以使用多线程对运算密集型任务提速.比如,如果一个线程完成 ...

  6. tornado 10 长轮询和 websocket

    tornado 10 长轮询和 websocket 一.长轮询 #在网页,我们经常扫码登录,那么问题来了,前端是如何知道用户在手机上扫码登录的呢 这里就需要用到长轮询 #长轮询 #客户端能够不断地向服 ...

  7. 洛谷 P3332 BZOJ 3110 [ZJOI2013]K大数查询

    题目链接 洛谷 bzoj 题解 整体二分 Code #include<bits/stdc++.h> #define LL long long #define RG register usi ...

  8. Tomcat启动分析

    [转自] http://docs.huihoo.com/apache/tomcat/heavyz/01-startup.html 1 - Tomcat Server的组成部分 1.1 - Server ...

  9. 尺取法 javascript算法

    给定长度为n的数列整数a0,a1……an-1 以及整数S.求出总和不小于S的连续子序列的长度的最小值.如果解不存在,则输出0. 输入 n=10 S=15 a=[5,1,3,5,10,7,4,9,2,8 ...

  10. django contenttype 表应用

    Django contenttypes 应用 contenttypes 是Django内置的一个应用,可以追踪项目中所有app和model的对应关系,并记录在ContentType表中. 每当我们创建 ...