[zt]客服端的HTMLdecode和HTMLencode---in javascript
2008-07-14 11:37
330 查看
今天碰到一个问题,在要通过ajax实现分页,需要对ajaxMethod返回的Html代码端重新组装,一段是分页,另一段是查询的结果,这样问题就来,如何分离这两端代码?我想到的办法就是在ajaxMethod里构造一个javascript对象,把这两段代码加到对象的属性值中如此模样
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
“//construct javascript object
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
var objHTML = new Object();
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
objHTML.firstSection = ?;
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
objHTML.secondSection = ?;
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
"然后在前台的callback函数中通过eval(strCode)构造返回的javascript对象,接下来更新相应的HTML块就非常简单啦。
在我替换上面代码中的问号处,本来是换上两段HTML代码块字符串就可以啦,但我想如果在这里给他们加上encode,那么在前台如何decode呢,我试了在后台加上Server.URLEncode(strHtml),前台需要套uridecode()和unecape(),但里面的空格还是‘+’,在加一个replace(//+/g,' ')就可以搞定啦,这样潜在的一个问题就是如果内容里面本来就有'+'会有问题的,于是我在网上搜了一下看看有没有更好的解决办法,结果发现一种很巧的办法,用HTML中的容器来实现。
javascript HTMLencode实现:
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLEncode(strHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerText = strHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
javascript HTMLdecode实现:
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLDecode(strEncodeHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerHTML = strEncodeHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerText;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
这样实现很方便简单,下面是示例代码供参考
function HTMLEncode(strHTML)
{
var div = document.createElement('div');
div.innerText = strHTML;
return div.innerHTML;
}
function HTMLDecode(strEncodeHTML)
{
var div = document.createElement('div');
div.innerHTML = strEncodeHTML;
return div.innerText;
}
function test1()
{
var strInput = prompt('test HTMLEncode(),please input decodeHTML','5');
alert(HTMLEncode(strInput));
}
function test2()
{
var strInput=prompt('test HTMLDecode(),please input encodeHTML','<div style="width:600px;"><input type="button" name="runStart" value="View" onclick="Run()" style="margin-left:2px;"><input type="button" name="runStart" value="RunScript" onclick="RunScript()" style="margin-left:10px;"><input type="button" name="reset" value="Clear" onclick="Reset()" style="margin-left:18px;"><span onclick="ExpandCollapse(this);" onmouseover="showMsg();" onmouseout="hideMsg();" msg="expand" style="font-family:webdings;font-size:18pt;cursor:pointer;">5</span></div><iframe name="ifrShow" style="margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;"></iframe><div id="divMsg" style="display:none"></div>');
alert(HTMLDecode(strInput));
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
<script type="text/javascript">
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLEncode(strHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerText = strHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLDecode(strEncodeHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerHTML = strEncodeHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerText;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function test1()
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var strInput = prompt('test HTMLEncode(),please input decodeHTML','<div style=/"width:600px;/"><input type=/"button/" name=/"runStart/" value=/"View/" onclick=/"Run()/" style=/"margin-left:2px;/" /><input type=/"button/" name=/"runStart/" value=/"RunScript/" onclick=/"RunScript()/" style=/"margin-left:10px;/" /><input type=/"button/" name=/"reset/" value=/"Clear/" onclick=/"Reset()/" style=/"margin-left:18px;/" /><span onclick=/"ExpandCollapse(this);/" onmouseover=/"showMsg();/" onmouseout=/"hideMsg();/" msg=/"expand/" style=/"font-family:webdings;font-size:18pt;cursor:pointer;/">5</span></div><iframe name=/"ifrShow/" style=/"margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;/"></iframe><div id=/"divMsg/" style=/"display:none/"></div>');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
alert(HTMLEncode(strInput));
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function test2()
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var strInput=prompt('test HTMLDecode(),please input encodeHTML','<div style="width:600px;"><input type="button" name="runStart" value="View" onclick="Run()" style="margin-left:2px;"><input type="button" name="runStart" value="RunScript" onclick="RunScript()" style="margin-left:10px;"><input type="button" name="reset" value="Clear" onclick="Reset()" style="margin-left:18px;"><span onclick="ExpandCollapse(this);" onmouseover="showMsg();" onmouseout="hideMsg();" msg="expand" style="font-family:webdings;font-size:18pt;cursor:pointer;">5</span></div><iframe name="ifrShow" style="margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;"></iframe><div id="divMsg" style="display:none"></div>');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
alert(HTMLDecode(strInput));
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
</script><button onclick="test1();">test HTMLEncode</button>
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
<button onclick="test2();">test HTMLDecode</button>
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
“//construct javascript object
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
var objHTML = new Object();
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
objHTML.firstSection = ?;
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
objHTML.secondSection = ?;
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
"然后在前台的callback函数中通过eval(strCode)构造返回的javascript对象,接下来更新相应的HTML块就非常简单啦。
在我替换上面代码中的问号处,本来是换上两段HTML代码块字符串就可以啦,但我想如果在这里给他们加上encode,那么在前台如何decode呢,我试了在后台加上Server.URLEncode(strHtml),前台需要套uridecode()和unecape(),但里面的空格还是‘+’,在加一个replace(//+/g,' ')就可以搞定啦,这样潜在的一个问题就是如果内容里面本来就有'+'会有问题的,于是我在网上搜了一下看看有没有更好的解决办法,结果发现一种很巧的办法,用HTML中的容器来实现。
javascript HTMLencode实现:
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLEncode(strHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerText = strHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
javascript HTMLdecode实现:
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLDecode(strEncodeHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerHTML = strEncodeHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerText;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
这样实现很方便简单,下面是示例代码供参考
function HTMLEncode(strHTML)
{
var div = document.createElement('div');
div.innerText = strHTML;
return div.innerHTML;
}
function HTMLDecode(strEncodeHTML)
{
var div = document.createElement('div');
div.innerHTML = strEncodeHTML;
return div.innerText;
}
function test1()
{
var strInput = prompt('test HTMLEncode(),please input decodeHTML','5');
alert(HTMLEncode(strInput));
}
function test2()
{
var strInput=prompt('test HTMLDecode(),please input encodeHTML','<div style="width:600px;"><input type="button" name="runStart" value="View" onclick="Run()" style="margin-left:2px;"><input type="button" name="runStart" value="RunScript" onclick="RunScript()" style="margin-left:10px;"><input type="button" name="reset" value="Clear" onclick="Reset()" style="margin-left:18px;"><span onclick="ExpandCollapse(this);" onmouseover="showMsg();" onmouseout="hideMsg();" msg="expand" style="font-family:webdings;font-size:18pt;cursor:pointer;">5</span></div><iframe name="ifrShow" style="margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;"></iframe><div id="divMsg" style="display:none"></div>');
alert(HTMLDecode(strInput));
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
<script type="text/javascript">
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLEncode(strHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerText = strHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function HTMLDecode(strEncodeHTML)
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var div = document.createElement('div');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
div.innerHTML = strEncodeHTML;
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
return div.innerText;
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function test1()
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var strInput = prompt('test HTMLEncode(),please input decodeHTML','<div style=/"width:600px;/"><input type=/"button/" name=/"runStart/" value=/"View/" onclick=/"Run()/" style=/"margin-left:2px;/" /><input type=/"button/" name=/"runStart/" value=/"RunScript/" onclick=/"RunScript()/" style=/"margin-left:10px;/" /><input type=/"button/" name=/"reset/" value=/"Clear/" onclick=/"Reset()/" style=/"margin-left:18px;/" /><span onclick=/"ExpandCollapse(this);/" onmouseover=/"showMsg();/" onmouseout=/"hideMsg();/" msg=/"expand/" style=/"font-family:webdings;font-size:18pt;cursor:pointer;/">5</span></div><iframe name=/"ifrShow/" style=/"margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;/"></iframe><div id=/"divMsg/" style=/"display:none/"></div>');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
alert(HTMLEncode(strInput));
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
function test2()
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockStart.gif)
![](http://www.cnblogs.com/images/OutliningIndicators/ContractedBlock.gif)
![](http://www.cnblogs.com/Images/dot.gif)
{
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
var strInput=prompt('test HTMLDecode(),please input encodeHTML','<div style="width:600px;"><input type="button" name="runStart" value="View" onclick="Run()" style="margin-left:2px;"><input type="button" name="runStart" value="RunScript" onclick="RunScript()" style="margin-left:10px;"><input type="button" name="reset" value="Clear" onclick="Reset()" style="margin-left:18px;"><span onclick="ExpandCollapse(this);" onmouseover="showMsg();" onmouseout="hideMsg();" msg="expand" style="font-family:webdings;font-size:18pt;cursor:pointer;">5</span></div><iframe name="ifrShow" style="margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;"></iframe><div id="divMsg" style="display:none"></div>');
![](http://www.cnblogs.com/images/OutliningIndicators/InBlock.gif)
alert(HTMLDecode(strInput));
![](http://www.cnblogs.com/images/OutliningIndicators/ExpandedBlockEnd.gif)
}
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
</script><button onclick="test1();">test HTMLEncode</button>
![](http://www.cnblogs.com/images/OutliningIndicators/None.gif)
<button onclick="test2();">test HTMLDecode</button>
相关文章推荐
- [zt]客服端的HTMLdecode和HTMLencode---in javascript
- javascript HTMLEncode HTMLDecode的完整实例(兼容ie和火狐)
- HTMlEncode和HTMLDecode、UrlEncode和 UrlDecode 定义和用法
- HTMlEncode和HTMLDecode、UrlEncode和 UrlDecode 定义和用法
- javascript另类方法高效实现htmlencode()与htmldecode()函数
- [转]Server.Htmlencode和Server.HtmlDecode的用法
- Ruby: Escape, Unescape, Encode, Decode, HTML, XML, URI, URL
- HTML encode & Decode
- javascript处理HTML的Encode(转码)和Decode(解码)总结
- 自定义HtmlEncode HtmlDecode
- HtmlEncode,HtmlDecode,UrlEncode,UrlDecode的使用
- Server.Htmlencode和Server.HtmlDecode的用法
- HTML Encode & Decode
- .net的htmlencode和htmldecode与java的escapeHtml和upescapehtml
- HtmlEncode、HtmlDecode、UrlEncode、UrlDecode
- javascript HTMLEncode HTMLDecode的完整实例(兼容ie和火狐)
- jQuery对html进行Encode和Decode
- javascript处理HTML的Encode(转码)和Decode(解码)总结
- javascript处理HTML的Encode(转码)和Decode(解码)总结
- javascript处理HTML的Encode(转码)和Decode(解码)总结