html decode 在线,在js中使用htmlEncode和htmlDecode

html的encode以及decode也是在开发中经常遇到的事情，比如针对表单的处理，当用户输入的内容包含html标签时，为了安全起见，提交到后台之前需要进行encode处理，即把类似<div>的内容转义为<div>。

下面就来具体看一下如何实现html的encode以及decode，这里将分别用html dom、js正则匹配、jquery这三种方法实现。

1、通过html dom实现

这里主要是通过document对象创建元素，然后把需要操作的字符串以不同的方式“写进”元素内，最后再通过innerHTML或者textContent(innerText)方法获取处理后的字符串。(注意textContent与innerText的区别)function htmlEncode ( str ) {

var ele = document.createElement('span');

ele.appendChild( document.createTextNode( str ) );

return ele.innerHTML;

}

function htmlDecode ( str ) {

var ele = document.createElement('span');

ele.innerHTML = str;

return ele.textContent || ele.innerText;

}

2、js正则匹配实现

在处理的过程中通过replace方法来对标签及html实体进行互相替换。function htmlEncode ( str ) {

var _str = '';

if ( str.length == 0 ) return '';

_str = str .replace(/&/g, '&');

_str = _str.replace(//g, '>');

return _str;

}

function htmlDecode ( str ) {

var _str = '';

if ( str.length == 0 ) return '';

_str = str .replace(/&/g, '&');

_str = _str.replace(/

_str = _str.replace(/>/g, '>');

_str = _str .replace(/"/g, '"');

return _str;

}

3、通过jQuery内置的html()方法及text()方法实现

这里实现起来就很简单了，如decode：通过$(‘’)创建标签，然后再把需要处理的字符串通过html()方法“写进”span元素中，最后再用text()获取就得到了decode后的内容。function htmlEncodeJQ ( str ) {

return $('').text( str ).html();

}

function htmlDecodeJQ ( str ) {

return $('').html( str ).text();

}

(本文由BeyondWeb.cn原创，转载请注明出处并保留原文链接)

html decode 在线,在js中使用htmlEncode和htmlDecode相关推荐

【C#】C#中的HtmlEncode与HtmlDecode：HttpUtility.HtmlEncode,Server.HtmlEncode,WebUtility.HtmlEncode
HtmlEncode(String) 将字符串转换为 HTML 编码字符串. HtmlDecode(String) 将已经为 HTTP 传输进行过 HTML 编码的字符串转换为已解码的字符串. 在we ...
兼容IE和FF的JS HTMLEncode和HTMLDecode的完整实例[转]
兼容IE和FF的JS HTMLEncode和HTMLDecode的完整实例,因为这个在在线编辑器和Ajax中经常用到,所以封装成函数可以直接调用,希望对大家有帮助. <html><h ...
疯狂的html css,疯狂Html+CSS+JS 中JS总结
0 总结本书的JS 第一章有讲语法有挺多常见的坑点和原理解释很不错第二章DOM编程讲述了挺多API 第三章事件处理机制其实对事件中的this关键字和事件传播顺序讲4. 解还不错第四章WebSto ...
js中应用protocol buffer
前段时间公司项目需要用到protocol buffer数据传输协议,这是什么东西,根本没接触过,好好的json干嘛不用?怀着好奇心去了解学习,最后顺利运用.下面是一些是经验,希望能帮到一些人. 首先我 ...
js中WINDOW对象中的navigator成员对象
js中DOM, DOCUMENT, BOM, WINDOW 区别全栈工程师开发手册 (作者:栾鹏) js系列教程6-BOM操作全解 js中WINDOW对象中的navigator成员对象 naviga ...
在 Node.js 中操作 Redis
在 Node.js 中操作 Redis Node.js 中可以操作 Redis 的软件包推荐列表:https://redis.io/clients#nodejs. 推荐下面两个: node-redis ...
JS中的DOM与BOM
一.Javascript组成 JavaScript的实现包括以下3个部分: ECMAScript(核心) 描述了JS的语法和基本对象. 文档对象模型 (DOM) 处理网页内容的方法和接口浏览器对象模 ...
JS中页面跳转，传值包含中文时乱码解决方案
首先,在JS中将要传递的中文编码:encodeURI(encodeURI(value)): 然后在跳转界面中取值时通过以下方式解码:java.net.URLDecoder.decode(value , ...
JS中的函数定义方式及全局函数
一.定义方式方式一用 function定义定义匿名函数,匿名函数可以被当作参数传递,不需要加入括号通过内置的function的对象创建函数 <!DOCTYPE html> <h ...

html decode 在线,在js中使用htmlEncode和htmlDecode

html decode 在线,在js中使用htmlEncode和htmlDecode相关推荐

最新文章

热门文章