javascript HTMLEncode HTMLDecode的完整实例(兼容ie和火狐)

更新时间：2009年06月02日 17:45:50 作者：

用的浏览器内部转换器实现转换，方法是动态创建一个容器标签元素

方法一：
用的浏览器内部转换器实现转换，方法是动态创建一个容器标签元素，如DIV，将要转换的字符串设置为这个元素的innerText(ie支持)||textContent(火狐支持)，然后返回这个元素的innerHTML，即得到经过HTML编码转换的字符串,显示的时候反过来就可以了（实际上显示的时候不用通过转换，直接赋值在div就可以正常显示的）。

复制代码代码如下:

<script type="text/javascript"> 
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; 
} 
var html = "<br>dffdf<p>qqqqq</p>"; 
var encodeHTML = HTMLEncode(html); 
alert("方式一：" + encodeHTML); 
var decodeHTML = HTMLDecode(encodeHTML); 
alert("方式一：" + decodeHTML); 
</script> 

方法二：
通过把正则表达式把<>和空格符转换成html编码,由于这种方式不是系统内置的所以很容易出现有些特殊标签没有替换的情况，而且效率低下

复制代码代码如下:

<script type="text/javascript"> 
function HTMLEncode2(str) 
{ 
var s = ""; 
if(str.length == 0) return ""; 
s = str.replace(/&/g,"&amp;"); 
s = s.replace(/</g,"&lt;"); 
s = s.replace(/>/g,"&gt;"); 
s = s.replace(/ /g,"&nbsp;"); 
s = s.replace(/\'/g,"&#39;"); 
s = s.replace(/\"/g,"&quot;"); 
return s; 
} 
function HTMLDecode2(str) 
{ 
var s = ""; 
if(str.length == 0) return ""; 
s = str.replace(/&amp;/g,"&"); 
s = s.replace(/&lt;/g,"<"); 
s = s.replace(/&gt;/g,">"); 
s = s.replace(/&nbsp;/g," "); 
s = s.replace(/&#39;/g,"\'"); 
s = s.replace(/&quot;/g,"\""); 
return s; 
} 
var html = "<br>ccccc<p>aaaaa</p>"; 
var encodeHTML = HTMLEncode2(html); 
alert("方式二：" + encodeHTML); 
var decodeHTML = HTMLDecode2("方式二：" + encodeHTML); 
alert(decodeHTML); 
</script>

您可能感兴趣的文章:

js实现可爱的气泡特效
这篇文章主要为大家详细介绍了js实现可爱的气泡特效，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-09-09
纯JavaScript 实现flappy bird小游戏实例代码
这篇文章主要介绍了纯JavaScript 实现flappy bird小游戏实例代码,b本文分七大步骤给大家介绍,非常不错，具有参考借鉴价值，需要的朋友可以参考下
2016-09-09
javascript实现时间日期的格式化的方法汇总
这篇文章主要介绍了javascript实现时间日期的格式化的方法汇总，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-08-08
localResizeIMG先压缩后使用ajax无刷新上传（移动端）
随着技术的发展，移动设备像素越来越高，但是这么大的图片怎么上传呢？下面小编就给大家一起学习移动端图片上传的方法之localResizeIMG先压缩后使用ajax无刷新上传，需要的朋友可以参考下
2015-08-08
微信小程序个人中心的列表控件实现代码
这篇文章主要介绍了微信小程序个人中心的列表控件实现代码，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
2020-04-04
如何使用headjs来管理和异步加载js
本文主要介绍如何使用headjs来管理和异步加载js，提高页面的加载速度，需要的朋友可以参考下
2016-11-11
javascript加减乘除的简单实例
下面小编就为大家带来一篇javascript加减乘除的简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-07-07
微信小程序实现modal弹出框遮罩层组件（可带文本框）
这篇文章主要给大家介绍了关于微信小程序实现modal弹出框遮罩层组件（可带文本框）的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-12-12
js实现缓冲运动效果的方法
这篇文章主要介绍了js实现缓冲运动效果的方法,涉及javascript操作元素运动的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-04-04
js中有关IE版本检测
javascript中经常用到IE版本的判定，实现特定需求的代码。检测浏览器虽然不是一个什么好的做法，但是有时候还是很必要的
2012-01-01