链接 js正则表达式的替换,js replace 方法、RegExp 对象
正则表达式替换使用的是replace()方法。Replace()方法是用一些字符替换另一些字符。
【笔记分享列表】
需求有点类似表情符的替换、表情符一般是对特定的表情表示符号替换成表情图片,这里的需求是对后端提供的富文本去除绝大多数的html标签但保留某些特定的简单标签,这些操作能在后端处理,但是放到前端是最佳的方式,这样各个平台也好保持一致,具体需要达到的效果有
1.111【换行】【空格】【空格】22【空格】【空格】【空格】【空格】22
因为html环境的原因这样的输入在显示时会出现换行无法显示以及空格只显示单个的问题,即文本格式会丢失,所以要能将【换行】替换成< br/>标签,【空格】换成
2.<div style="color:'#000000'"/>
因为html环境的原因这样的复杂标签要解析成纯文本显示,也就是<要替换成< >要替换成> &要替换成& "要替换成"
3.对于简单的标签(注:一般不含空格的)我们希望能够支持,如< b> < hr/>等
注意若需要显示< b>这样的简单标签的文本形式则需要写成<【空格】b>以区分格式标签
htmlEscape网上有实现:
escapeArr存放简单标签和转换形式的对应关系
1.111【换行】【空格】【空格】22【空格】【空格】【空格】【空格】22
因为html环境的原因这样的输入在显示时会出现换行无法显示以及空格只显示单个的问题,即文本格式会丢失,所以要能将【换行】替换成< br/>标签,【空格】换成
2.<div style="color:'#000000'"/>
因为html环境的原因这样的复杂标签要解析成纯文本显示,也就是<要替换成< >要替换成> &要替换成& "要替换成"
3.对于简单的标签(注:一般不含空格的)我们希望能够支持,如< b> < hr/>等
注意若需要显示< b>这样的简单标签的文本形式则需要写成<【空格】b>以区分格式标签
htmlEscape网上有实现:
function htmlEscape(text){为了支持第三条规则我们这样处理
return text.replace(/[<>"&]/g, function(match, pos, originalText){
switch(match){
case "<": return "<";
case ">":return ">";
case "&":return "&";
case "\"":return """;
}
});
}
escapeArr存放简单标签和转换形式的对应关系
var escapeArr = {获取RegExp
'<b>':'< b>',
....
}
var escapeRegxTest='';支持简单标签的处理
for(var str in escapeArr){
escapeRegxTest+=str+'|'
}
escapeRegxTest=escapeRegxTest.substr(0,escapeRegxTest.length-1);
var escapeRegx=new RegExp(escapeRegxTest,"g");
function simpleHtmlEscapeReverse(escapeedHtml){
return escapeedHtml.replace(escapeRegx, function(match,item, index){
console.log(match);
return escapeArr[match];
});
}
对【后端提供的富文本去除绝大多数的html标签但保留某些特定的简单标签】的需求放在客户端处理会出现一些瓶颈,第一个问题是后端返回的富文本数据不能直接写到前端,因为html显示异常会造成无法读取渲染失败的标签进行重新格式化,比如你在页面输入<div><div></div>这样的输入时浏览器渲染的只有<div></div>,前面的div会从dom丢失从而无法读取操作,这样jquery就根本无法读取这个标签进行相关操作。
对于上一个问题可以选择将htmlEscape的操作放到后端来完成,这样前端只需要处理htmlEscape的后续步骤,但是无论怎样处理,由于是js渲染的原因还是会格式丢失从而seo效果不理想的问题。所以绝大多数情况下这部分的逻辑会放到后端来完成。
下面是使用后端语言php完成相关效果的代码
对于上一个问题可以选择将htmlEscape的操作放到后端来完成,这样前端只需要处理htmlEscape的后续步骤,但是无论怎样处理,由于是js渲染的原因还是会格式丢失从而seo效果不理想的问题。所以绝大多数情况下这部分的逻辑会放到后端来完成。
下面是使用后端语言php完成相关效果的代码
1.为实现相似的需求php端为我们提供了现成函数preg_replace,它可以成对的替换满足条件的字符串
注意正则式需要用/.../包裹起来,另外当字符串出现/时需要使用\移义
这个函数还有其他的一些参数,具体的参数用法详见[附件一]地址
public static $escapeArr1=array("/<b>/,'/<\/b>/',.....");你可能会遇到报错
public static $escapeArr2=array("< b>","< /b>");
Unknown modifier 'g' PHP regex error原因是:
注意正则式需要用/.../包裹起来,另外当字符串出现/时需要使用\移义
这个函数还有其他的一些参数,具体的参数用法详见[附件一]地址
function preg_replace ($pattern, $replacement, $subject, $limit = -1, &$count = null) {}
在Python中的实现版本如下:下面的例子是将正则表达式匹配到的数字加上100得到新的字符串
import re
inputStr = "hello 123 world 456";
def _add111(matched):
intStr = matched.group("number"); # 123
intValue = int(intStr);
addedValue = intValue + 111; # 234
addedValueStr = str(addedValue);
return addedValueStr;
replacedStr = re.sub("(?P<number>\d+)", _add111, inputStr);
print(replacedStr);