HTML的Encode(转码)和解码(Decode)在平时的开发中也是经常要处理的,在这里总结了使用javascript处理HTML的Encode(转码)和解码(Decode)的常用方式

一、用浏览器内部转换器实现转换
1.1.用浏览器内部转换器实现html转码
  首先动态创建一个容器标签元素,如DIV,然后将要转换的字符串设置为这个元素的innerText(ie支持)或者textContent(火狐,google支持),最后返回这个元素的innerHTML,即得到经过HTML编码转换的字符串了。

1.2.用浏览器内部转换器实现html解码
  首先动态创建一个容器标签元素,如DIV,然后将要转换的字符串设置为这个元素的innerHTML(ie,火狐,google都支持),最后返回这个元素的innerText(ie支持)或者textContent(火狐,google支持),即得到经过HTML解码的字符串了。

1.3.具体实现代码

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;
}
};
二、用正则表达式进行转换处理
  使用正则表达式也是一种常用的处理方式,实现原理就是使用替换的方式来实现转码和解码,转码时把<>,空格符,&,’,""替换成html编码,解码就把html编码替换成对应的字符,实现代码如下:

var HtmlUtil = {
/1.用正则表达式实现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;
},
/2.用正则表达式实现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;
}
};
三、封装HtmlUtil工具类
  将两种方式封装HtmlUtil工具类,方便在开发中使用,完整代码如下:
  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;
}
};

HTML的Encode(转码)和解码(Decode)相关推荐

  1. python解码函数_python2和python3的编码encode解码decode函数

    python比较坑的一个点:意义完全变了的两个函数 首先 常用的编码方式有3种,utf-8:  常用的传输和存储格式,Unicode的一种简化 Unicode:包括了所有可能字符的国际统一编码 GBK ...

  2. python的decode函数报错_python2和python3的编码encode解码decode函数

    python比较坑的一个点:意义完全变了的两个函数 首先 常用的编码方式有3种,utf-8:  常用的传输和存储格式,Unicode的一种简化 Unicode:包括了所有可能字符的国际统一编码 GBK ...

  3. Python编码encode()与解码decode()介绍与示例演示

    1.编码与解码介绍 位:计算机最小的单位 二进制中的一位 用二进制的 0/1表示. 字节:八位组成一个字节. 字符:我们肉眼可见的文字与符号. 字符集:字符的集合. 编码:将字符转换成计算机可识别的0 ...

  4. Base64的编码(Encode)与解码(Decode)

    Base64的编码(Encode)与解码(Decode) 推荐第一种 效率更高. 第一种:java8 新版本 @Testpublic void test1(){//现在Base64编码 import ...

  5. 条形码和二维码编码解码工具类源码

    有一个好的工具,会让你的开发事半功倍.再将讲这个工具类之前,我先给小白补充一点条形码和二维码(以下基础知识选自,我本科阶段的一本教材:<物联网导论>(刘云浩 编著).有对物联网感兴趣的,可 ...

  6. java qlv转mp4 代码_Java实用工具类五:URL转码、解码类

    package com.cn.hnust.util; import java.io.UnsupportedEncodingException; import java.util.HashMap; im ...

  7. 使用URLEncoder、URLDecoder进行URL参数的转码与解码

    url后参数的转码与解码 import java.net.URLDecoder; import java.net.URLEncoder; String strTest = "?=abc?中% ...

  8. url中传递中文参数时的转码与解码

    URL传递中文参数时的几种处理方式,总结如下: 1.将字符串转码:newString("xxxxx".getBytes("iso-8859-1")," ...

  9. Java实用工具类五:URL转码、解码类

    此文仅对自己工作中用到的类进行总结,方便以后的使用. package com.cn.hnust.util;import java.io.UnsupportedEncodingException; im ...

最新文章

  1. asp.net文件上传下载的简单实现
  2. CLASSPATH的作用
  3. scala学习手记25 - Curry化
  4. java排序——插入排序
  5. DynaSLAM跑通的辛酸之路
  6. 【English Email】CIP payouts now in Workday
  7. 最小权顶点覆盖问题分析
  8. vba判断是否为数字的方法小集
  9. 360路由器c301最新固件支持万能中继
  10. 想看程序员的成长课这本书
  11. FileZilla Server远程管理
  12. 超级计算机比赛规则,介绍围棋的规则与玩法
  13. 计算机定时关机命令,定时关机命令,小编教你怎么使用命令行定时关机
  14. JAVA关于MD5加盐加密算法
  15. 按自己的思想写商业计划
  16. 重复独立事件,伯努利概型 (概统1)
  17. 如何添加网络打印机-查看IP地址就可以
  18. 软件系统等保方案,市政项目,投标项目必须
  19. Qt编写可视化大屏电子看板系统26-模块4模具进度
  20. 学习记录-Simpack生成车轮不圆的几种示例

热门文章

  1. 【笔记】计算机指令集结构
  2. android 仿支付页面,【android仿系列进阶篇】android 支付宝手机网页支付
  3. java运行时异常能捕获吗_Java运行时异常
  4. 文件包含LFI漏洞Getshell日志文件目录遍历
  5. 主题:10个iPhone开发网站、论坛、博客
  6. python 边读边写文件_Python 文件读写
  7. 冰箱选得好,带娃没烦恼——高知宝妈冰箱选购经验分享
  8. iOS如何获取IDFA
  9. 易考题库 JAVA_EasyExam
  10. 常用英语食品词汇- 海产类