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

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

下面就来具体看一下如何实现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原创，转载请注明出处并保留原文链接)