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 相关文章推荐
setTimeout和setInterval的区别你真的了解吗?
Mar 31 Javascript
让innerText在firefox火狐和IE浏览器都能用的写法
May 14 Javascript
js 链式延迟执行DOME
Jan 04 Javascript
jquery.Jwin.js 基于jquery的弹出层插件代码
May 23 Javascript
javascript将数组插入到另一个数组中的代码
Jan 10 Javascript
js禁止页面使用右键(简单示例代码)
Nov 13 Javascript
javascript中函数作为参数调用的方法
Feb 09 Javascript
jQuery实现连续动画效果实例分析
Oct 09 Javascript
Underscore源码分析
Dec 30 Javascript
详解vue2 $watch要注意的问题
Sep 08 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
May 19 jQuery
公众号SVG动画交互实战代码
May 31 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
PHP学习之PHP运算符
2006/10/09 PHP
php抓即时股票信息
2006/10/09 PHP
PHP实现八皇后算法
2019/05/06 PHP
IE和Firefox下javascript的兼容写法小结
2008/12/10 Javascript
javascript 获取模态窗口的滚动位置代码
2013/08/06 Javascript
45个JavaScript编程注意事项、技巧大全
2015/02/11 Javascript
纯javascript模仿微信打飞机小游戏
2015/08/20 Javascript
JavaScript实现下拉菜单的显示和隐藏
2016/01/05 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
浅析Jquery操作select
2016/12/13 Javascript
JS实现iframe自适应高度的方法示例
2017/01/07 Javascript
Vue.js中轻松解决v-for执行出错的三个方案
2017/06/09 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
2018/01/11 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
2018/08/14 jQuery
Bootstrap fileinput 上传新文件移除时触发服务器同步删除的配置
2018/10/08 Javascript
jQuery实现的简单日历组件定义与用法示例
2018/12/24 jQuery
vue实现弹幕功能
2019/10/25 Javascript
node.js事件轮询机制原理知识点
2019/12/22 Javascript
three.js 实现露珠滴落动画效果的示例代码
2021/03/01 Javascript
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
Python竟能画这么漂亮的花,帅呆了(代码分享)
2017/11/15 Python
Python图片转换成矩阵,矩阵数据转换成图片的实例
2018/07/02 Python
Python数据可视化教程之Matplotlib实现各种图表实例
2019/01/13 Python
Python2与Python3的区别实例分析
2019/04/11 Python
基于Python实现扑克牌面试题
2019/12/11 Python
使用CSS3的appearance属性改变元素的外观的方法
2015/12/12 HTML / CSS
HTML5有哪些新特征
2015/12/01 HTML / CSS
Charlotte Tilbury英国官网:英国彩妆品牌
2017/05/26 全球购物
Bibloo罗马尼亚网站:女装、男装、童装及鞋子和配饰
2019/07/20 全球购物
工商技校毕业生自荐信
2013/11/15 职场文书
妇产医师自荐信
2014/01/29 职场文书
质量月口号
2014/06/20 职场文书
公务员年终个人总结
2015/02/12 职场文书
高考诚信考试承诺书
2015/04/29 职场文书
求职意向书范本
2015/05/11 职场文书
入党转正申请自我鉴定
2019/06/25 职场文书