网络编程 
首页 > 网络编程 > 浏览文章

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

(编辑:jimmy 日期: 2025/5/13 浏览:3 次 )
方法一:
用的浏览器内部转换器实现转换,方法是动态创建一个容器标签元素,如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>
上一篇:Javascript 获取字符串字节数的多种方法
下一篇:Javascript String对象扩展HTML编码和解码的方法
一句话新闻
一文看懂荣耀MagicBook Pro 16
荣耀猎人回归!七大亮点看懂不只是轻薄本,更是游戏本的MagicBook Pro 16.
人们对于笔记本电脑有一个固有印象:要么轻薄但性能一般,要么性能强劲但笨重臃肿。然而,今年荣耀新推出的MagicBook Pro 16刷新了人们的认知——发布会上,荣耀宣布猎人游戏本正式回归,称其继承了荣耀 HUNTER 基因,并自信地为其打出“轻薄本,更是游戏本”的口号。
众所周知,寻求轻薄本的用户普遍更看重便携性、外观造型、静谧性和打字办公等用机体验,而寻求游戏本的用户则普遍更看重硬件配置、性能释放等硬核指标。把两个看似难以相干的产品融合到一起,我们不禁对它产生了强烈的好奇:作为代表荣耀猎人游戏本的跨界新物种,它究竟做了哪些平衡以兼顾不同人群的各类需求呢?
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 网站地图 SiteMap