JavaScript 替换Html标签实现代码


Posted in Javascript onOctober 14, 2009
str = str.<br /> 
replace( /&(?!#?\w+;)/g , '&').<br /> 
replace( /undefinedundefined([^undefinedundefined]*)"/g , '“$1”' ).<br /> 
replace( /</g , '<' ).<br /> 
replace( />/g , '>' ).<br /> 
replace( /…/g , '…' ).<br /> 
replace( /“/g , '“' ).<br /> 
replace( /”/g , '”' ).<br /> 
replace( /‘/g , '‘' ).<br /> 
replace( /'/g , ''' ).<br /> 
replace( /—/g , '—' ).<br /> 
replace( /?/g , '?' );

上面这个还算短了,我看过一些论坛的JS代码,在把Wind Code转换成HTML时,那真是疯子似的写上二三十行。其实我们大可以把这些匹配模式与替换后的字符放到一个哈希中,然后一口气替换掉。
var hash = { 
'<' : '<' , 
'>' : '>', 
'…' : '…', 
'“' : '“' , 
'”' : '”' , 
'‘' : '‘' , 
''' : ''' , 
'—' : '—', 
'?' : '?' 
}; 
str = str. 
replace( /&(?!#?\w+;)/g , '&' ). 
replace( /undefinedundefined([^undefinedundefined]*)"/g , '“$1”' ). 
replace( /[<>…“”‘'—?]/g , function ( $0 ) { 
return hash[ $0 ]; 
});

但这个缺陷也很明显,如哈希的键必须是简单的普通字符串,不能是复杂正则,这就是我们不得不分开的原因。replace在老一点的浏览器是不支持function的。为此,我们只好放弃上面最后那个replace方式,替换方统一为普通字符串。
String.prototype.multiReplace = function ( hash ) { 
var str = this, key; 
for ( key in hash ) { 
if ( Object.prototype.hasOwnProperty.call( hash, key ) ) { 
str = str.replace( new RegExp( key, 'g' ), hash[ key ] ); 
} 
} 
return str; 
};

Object.prototype.hasOwnProperty.call( hash, key )是用来过滤继承自原型的方法与属性的。这样一来,使用就简单了:
str = str.multiReplace({ 
'&(?!#?\\w+;)' :'&', 
'undefinedundefined([^undefinedundefined]*)" : '“$1”', 
'<' : '<' , 
'>' : '>', 
'…' : '…', 
'“' : '“' , 
'”' : '”' , 
'‘' : '‘' , 
''' : ''' , 
'—' : '—', 
'?' : '?' 
});
Javascript 相关文章推荐
jquery()函数的三种语法介绍
Oct 09 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
Nov 19 Javascript
JavaScript的strict模式与with关键字介绍
Feb 08 Javascript
用js闭包的方法实现多点标注冒泡示例
May 29 Javascript
jQuery学习笔记之jQuery中的$
Jan 19 Javascript
原生JS实现LOADING效果
Mar 16 Javascript
Position属性之relative用法
Dec 14 Javascript
封装好的javascript前端分页插件pagination
Jan 04 Javascript
angularjs ocLazyLoad分步加载js文件实例
Jan 17 Javascript
vue小图标favicon不显示的解决方案
Sep 19 Javascript
jQuery HTML css()方法与css类实例详解
May 20 jQuery
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
Nov 16 Javascript
JavaScript null和undefined区别分析
Oct 14 #Javascript
JavaScript iframe的相互操作浅析
Oct 14 #Javascript
使用jQuery简化Ajax开发 Ajax开发入门
Oct 14 #Javascript
jQuery技巧大放送 学习jquery的朋友可以看下
Oct 14 #Javascript
JS+XML 省份和城市之间的联动实现代码
Oct 14 #Javascript
jquery 常用操作整理 基础入门篇
Oct 14 #Javascript
一些技巧性实用js代码小结
Oct 14 #Javascript
You might like
福利彩票幸运号码自动生成器
2006/10/09 PHP
PHP目录函数实现创建、读取目录教程实例
2011/01/13 PHP
PHP中全面阻止SQL注入式攻击分析小结
2012/01/30 PHP
ThinkPHP3.0略缩图不能保存到子目录的解决方法
2012/09/30 PHP
JavaScript实现滚动栏效果的方法
2015/04/27 PHP
TP3.2框架分页相关实现方法分析
2020/06/03 PHP
解决extjs在firefox中关闭窗口再打开后iframe中js函数访问不到的问题
2008/11/06 Javascript
IE中createElement需要注意的一个问题
2010/07/13 Javascript
node.js中的fs.appendFile方法使用说明
2014/12/17 Javascript
jQuery实现的指纹扫描效果实例(附演示与demo源码下载)
2016/01/26 Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
2016/07/08 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
Vue中之nextTick函数源码分析详解
2017/10/17 Javascript
JavaScript如何对图片进行黑白化
2018/04/10 Javascript
WebSocket的通信过程与实现方法详解
2018/04/29 Javascript
vue + webpack如何绕过QQ音乐接口对host的验证详解
2018/07/01 Javascript
详解JavaScript 浮点数运算的精度问题
2019/07/23 Javascript
详解JavaScript 异步编程
2020/07/13 Javascript
es5 类与es6中class的区别小结
2020/11/09 Javascript
uniapp开发小程序实现滑动页面控制元素的显示和隐藏效果
2020/12/10 Javascript
详解Python3.6安装psutil模块和功能简介
2018/05/30 Python
django 自定义filter 判断if var in list的例子
2019/08/20 Python
使用Python求解带约束的最优化问题详解
2020/02/11 Python
浅谈pymysql查询语句中带有in时传递参数的问题
2020/06/05 Python
python3爬虫中多线程进行解锁操作实例
2020/11/25 Python
HTML5 body设置全屏背景图片的示例代码
2020/12/08 HTML / CSS
办公室主任岗位职责
2013/11/08 职场文书
客服工作职责
2013/12/11 职场文书
办理居住证介绍信
2014/01/15 职场文书
简历里的自我评价范文
2014/02/24 职场文书
2014年国培研修感言
2014/03/09 职场文书
文秘求职信范文
2014/04/10 职场文书
服装仓管员岗位职责
2014/06/17 职场文书
小学亲子活动总结
2014/07/01 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
大学感恩节活动策划方案
2014/10/11 职场文书