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 相关文章推荐
from 表单提交返回值用post或者是get方法实现
Aug 21 Javascript
JavaScript异步加载浅析
Dec 28 Javascript
js实现图片无缝滚动
Dec 23 Javascript
学习javascript面向对象 理解javascript原型和原型链
Jan 04 Javascript
限制复选框最多选择项的实现代码
May 30 Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
Sep 04 Javascript
Bootstrap基本样式学习笔记之按钮(4)
Dec 07 Javascript
Vue.js组件通信的几种姿势
Oct 23 Javascript
element-ui 表格实现单元格可编辑的示例
Feb 26 Javascript
JavaScript学习笔记之数组基本操作示例
Jan 09 Javascript
微信小程序搜索功能(附:小程序前端+PHP后端)
Feb 28 Javascript
vue路由的配置和页面切换详解
Sep 09 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
虹吸壶是谁发明的?煮出来的咖啡好喝吗
2021/03/04 冲泡冲煮
通过ODBC连接的SQL SERVER实例
2006/10/09 PHP
PHP4实际应用经验篇(5)
2006/10/09 PHP
E路文章系统PHP
2006/12/11 PHP
snoopy PHP版的网络客户端提供本地下载
2008/04/15 PHP
UTF-8正则表达式如何匹配汉字
2015/08/03 PHP
PHP微信红包API接口
2015/12/05 PHP
php封装的mysqli类完整实例
2016/10/18 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
Laravel5.1 框架Request请求操作常见用法实例分析
2020/01/04 PHP
关于IFRAME 自适应高度的研究
2006/07/20 Javascript
js 调整select 位置的函数
2008/02/21 Javascript
jquery实现带复选框的表格行选中删除时高亮显示
2013/08/01 Javascript
JS冒泡事件的快速解决方法
2013/12/16 Javascript
Angular的MVC和作用域
2016/12/26 Javascript
jq给页面添加覆盖层遮罩的实例
2017/02/16 Javascript
Web纯前端“旭日图”实现元素周期表
2017/03/10 Javascript
js合并两个数组生成合并后的key:value数组
2018/05/09 Javascript
vue 自定义右键样式的实例代码
2019/11/06 Javascript
javascript实现简易数码时钟
2020/03/30 Javascript
基于python OpenCV实现动态人脸检测
2018/05/25 Python
Python基于pandas实现json格式转换成dataframe的方法
2018/06/22 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
python环境搭建和pycharm的安装配置及汉化详细教程(零基础小白版)
2020/08/19 Python
Opencv常见图像格式Data Type及代码实例
2020/11/02 Python
马来西亚在线时尚女装商店:KEI MAG
2017/09/28 全球购物
Lookfantastic美国/加拿大:英国知名美妆购物网站
2019/03/27 全球购物
linux面试题参考答案(4)
2013/01/28 面试题
致跳远运动员广播稿
2014/02/11 职场文书
党的群众路线教育实践活动个人对照检查剖析材料
2014/09/23 职场文书
检察院对照“四风”认真查找问题落实整改措施
2014/09/26 职场文书
仓管员岗位职责范本
2015/04/01 职场文书
入党转正申请报告
2015/05/15 职场文书
离婚答辩状怎么写
2015/05/22 职场文书
政审证明范文
2015/06/19 职场文书
css3新特性的应用示例分析
2022/03/16 HTML / CSS