js replace替换字符串同时替换多个方法


Posted in Javascript onNovember 27, 2018

在实际开发中,经常会遇到替换字符串的情况,但是大多数情况都是用replace替换一种字符串,本文介绍了如何使用replace替换多种指定的字符串,同时支持可拓展增加字符串关键字。

let content = `<div id="article_content273475" class="article-content-wrap"> 
 <p><strong>宅是一种信仰。</strong><br></p>
 <p><br></p>
 <p>Wi-Fi + 床 = 低配宅。</p>
 <p><br></p>
 <p>Wi-Fi + 床 + 零食 + 网综= 进阶版肥宅。</p>
 <p><br></p>
 <p>Wi-Fi + 床 + 零食 + 网综 + 外卖 + 撸猫 = 人间天堂金不换宅。</p>
 <p><br></p>
 <p>移动互联网迅猛发展的当下,“人间天堂金不换”版宅可以说是当下一些“9000岁”<span class="text-remarks" label="备注">(即“90后”和“00后”)</span>年轻人的生活常态了。</p>

     </div>`;
       let article = content.replace(/(\<img|\<p|\<article|\<\/article|\<header|\<\/header)/gi, function ($0, $1) {
       return {
        "<img": '<img style="width:100%;height:auto;display:block;" ',
        "<p": '<p style="text-indent: 24px;" ',
        "<article":"<div",
        "</article": "</div",
        "<header": "<div",
        "</header": "</div"
       }[$1];
      });
      console.log(article)

replace里的g表示全局替换,而每个关键词前面的\则为转义字符,在针对html类的标签替换的时候,是必不可少的。

下面看下js同时替换多个字符串的方法

<script>
  var s="my javascript is very poor,who can help me?"
  var reg=/(\w*)my(.*)is(.*)can(.*)/g
  alert(s.replace(reg,"$1his$2was$3could$4"));
</script>

总结

以上所述是小编给大家介绍的js replace替换字符串同时替换多个方法 ,希望对大家有所帮助,如果大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
在textarea文本域中显示HTML代码的方法
Mar 06 Javascript
javascript之卸载鼠标事件的代码
May 14 Javascript
基于jquery的大众点评,分类导航实现代码
Aug 23 Javascript
iframe调用父页面函数示例详解
Jul 17 Javascript
jQuery实现切换字体大小的方法
Mar 10 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
Jan 26 Javascript
js实现tab切换效果
Feb 16 Javascript
Bootstrap导航中表单简单实现代码
Mar 06 Javascript
详解Angular2 之 结构型指令
Jun 21 Javascript
Node.js模块全局安装路径配置方法
May 17 Javascript
详解如何使用微信小程序云函数发送短信验证码
Mar 13 Javascript
正则表达式基础与常用验证表达式
Jun 16 Javascript
Vue中用props给data赋初始值遇到的问题解决
Nov 27 #Javascript
使用electron制作满屏心特效的示例代码
Nov 27 #Javascript
30分钟快速实现小程序语音识别功能
Nov 27 #Javascript
基于Koa2写个脚手架模拟接口服务的方法
Nov 27 #Javascript
Vue实现移动端左右滑动效果的方法
Nov 27 #Javascript
vue2.0移动端滑动事件vue-touch的实例代码
Nov 27 #Javascript
详解vuex 渐进式教程实例代码
Nov 27 #Javascript
You might like
The specified CGI application misbehaved by not returning a complete set of HTTP headers
2011/03/31 PHP
PHP禁止页面缓存的代码
2011/10/23 PHP
Laravel中Facade的加载过程与原理详解
2017/09/22 PHP
PHP使用PDO操作sqlite数据库应用案例
2019/03/07 PHP
php+ajax实现商品对比功能示例
2019/04/13 PHP
ajaxControlToolkit AutoCompleteExtender的用法
2008/10/30 Javascript
jQuery 类twitter的文本字数限制带提示效果插件
2010/04/16 Javascript
jquery 读取页面load get post ajax 四种方式代码写法
2011/04/02 Javascript
js截取固定长度的中英文字符的简单实例
2013/11/22 Javascript
js获取触发事件元素在整个网页中的绝对坐标(示例代码)
2013/12/13 Javascript
基于html5和nodejs相结合实现websocket即使通讯
2015/11/19 NodeJs
jQuery Masonry瀑布流布局神器使用详解
2017/05/25 jQuery
详解create-react-app 自定义 eslint 配置
2018/06/07 Javascript
TypeScript基础入门教程之三重斜线指令详解
2018/10/22 Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
2019/05/14 jQuery
Vue.js中的组件系统
2019/05/30 Javascript
layui使用templet格式化表格数据的方法
2019/09/16 Javascript
vue学习笔记之作用域插槽实例分析
2020/02/01 Javascript
详解vue 组件
2020/06/11 Javascript
[01:48]DOTA2 2015国际邀请赛中国区预选赛第二日战报
2015/05/27 DOTA
[04:10]2018年度CS GO玩家最喜爱的主播-完美盛典
2018/12/16 DOTA
django 多数据库配置教程
2018/05/30 Python
python2.7 安装pip的方法步骤(管用)
2019/05/05 Python
Python使用matplotlib实现交换式图形显示功能示例
2019/09/06 Python
TensorFlow实现从txt文件读取数据
2020/02/05 Python
python 比较字典value的最大值的几种方法
2020/04/17 Python
django queryset 去重 .distinct()说明
2020/05/19 Python
Keras 数据增强ImageDataGenerator多输入多输出实例
2020/07/03 Python
Python Opencv图像处理基本操作代码详解
2020/08/31 Python
python中如何打包用户自定义模块
2020/09/23 Python
python实现图像随机裁剪的示例代码
2020/12/10 Python
Nike荷兰官方网站:Nike.com (NL)
2018/04/19 全球购物
Fossil美国官网:化石手表、手袋、首饰及配饰
2019/02/17 全球购物
Araks官网:纽约内衣品牌
2020/10/15 全球购物
年会邀请函范文
2015/01/30 职场文书
Python Numpy之linspace用法说明
2021/04/17 Python