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 相关文章推荐
JavaScript.Encode手动解码技巧
Jul 14 Javascript
extjs grid设置某列背景颜色和字体颜色的实现方法
Sep 06 Javascript
用Juery网页选项卡实现代码
Jun 13 Javascript
Ext JS 4实现带week(星期)的日期选择控件(实战一)
Aug 21 Javascript
js实现兼容IE、Firefox的图片缩放代码
Dec 08 Javascript
JavaScript学习总结之JS、AJAX应用
Jan 29 Javascript
Ext JS动态加载JavaScript创建窗体的方法
Jun 23 Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
Aug 18 Javascript
JS 全屏和退出全屏详解及实例代码
Nov 07 Javascript
如何使用less实现随机下雪动画详解
Jan 02 Javascript
Vue 权限控制的两种方法(路由验证)
Aug 16 Javascript
django简单的前后端分离的数据传输实例 axios
May 18 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程序猿都应该拜读的书
2014/12/31 PHP
php获取、检查类名、函数名、方法名的函数方法
2015/06/25 PHP
php截取视频指定帧为图片
2016/05/16 PHP
PHP编写文件多服务器同步程序
2016/07/02 PHP
PHP中cookie知识点学习
2018/05/06 PHP
从零开始学习jQuery (十) jQueryUI常用功能实战
2011/02/23 Javascript
让图片旋转任意角度及JQuery插件使用介绍
2013/03/20 Javascript
ComboBox 和 DateField 在IE下消失的解决方法
2013/08/30 Javascript
javascript数据结构与算法之检索算法
2015/04/04 Javascript
基于javascript的Form表单验证
2016/12/29 Javascript
bootstrap警告框使用方法解析
2017/01/13 Javascript
angular 用拦截器统一处理http请求和响应的方法
2017/06/08 Javascript
AngularJS实现单一页面内设置跳转路由的方法
2017/06/28 Javascript
微信小程序实现页面跳转传值的方法
2017/10/12 Javascript
vue几个常用跨域处理方式介绍
2018/02/07 Javascript
vue动画之点击按钮往上渐渐显示出来的实例
2018/09/29 Javascript
在JavaScript中使用严格模式(Strict Mode)
2019/06/13 Javascript
JavaScript 处理树数据结构的方法示例
2019/06/16 Javascript
JS利用prototype给类添加方法操作详解
2019/06/21 Javascript
vue中axios的二次封装实例讲解
2019/10/14 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
[01:06:39]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第三局
2016/03/02 DOTA
python函数返回多个值的示例方法
2013/12/04 Python
python基础教程之实现石头剪刀布游戏示例
2014/02/11 Python
python自动安装pip
2014/04/24 Python
使用Python的Flask框架来搭建第一个Web应用程序
2016/06/04 Python
python验证码识别教程之滑动验证码
2018/06/04 Python
关于python写入文件自动换行的问题
2018/06/23 Python
python os.fork() 循环输出方法
2019/08/08 Python
健身场所或家用健身设备:Life Fitness
2017/11/01 全球购物
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
采购主管的岗位职责
2013/12/17 职场文书
小班下学期评语
2014/05/04 职场文书
电钳工人个人求职信
2014/05/10 职场文书
2014大学生批评与自我批评思想汇报
2014/09/21 职场文书
高中社区服务活动报告
2015/02/05 职场文书