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 相关文章推荐
Javascript中获取出错代码所在文件及行数的代码
Sep 23 Javascript
jquery.pagination.js 无刷新分页实现步骤分享
May 23 Javascript
javascript表单验证 - Parsley.js使用和配置
Jan 25 Javascript
jQuery实现可用于博客的动态滑动菜单
Mar 09 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
jQuery前端开发35个小技巧
May 24 Javascript
Listloading.js移动端上拉下拉刷新组件
Aug 04 Javascript
Angularjs的ng-repeat中去除重复数据的方法
Aug 05 Javascript
非常实用的vue导航钩子
Mar 20 Javascript
ejsExcel模板在Vue.js项目中的实际运用
Jan 27 Javascript
JQuery事件委托原理与用法实例分析
May 13 jQuery
Element-ui el-tree新增和删除节点后如何刷新tree的实例
Aug 31 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
PHP自带ZIP压缩、解压缩类ZipArchiv使用指南
2015/03/03 PHP
Yii2分页的使用及其扩展方法详解
2016/05/23 PHP
PHP+Session防止表单重复提交的解决方法
2018/04/09 PHP
Laravel框架实现多个视图共享相同数据的方法详解
2019/07/09 PHP
基于jquery的让页面控件不可用的实现代码
2010/04/27 Javascript
javascript放大镜效果的简单实现
2013/12/09 Javascript
一个JavaScript获取元素当前高度的实例
2014/10/29 Javascript
JavaScript中的anchor()方法使用详解
2015/06/08 Javascript
window.location.hash知识汇总
2015/11/09 Javascript
Bootstrap Tree View简单而优雅的树结构组件实例解析
2017/06/15 Javascript
vue上传图片组件编写代码
2017/07/26 Javascript
Angular4学习笔记之实现绑定和分包
2017/08/01 Javascript
vue发送websocket请求和http post请求的实例代码
2019/07/11 Javascript
VScode格式化ESlint方法(最全最好用方法)
2019/09/10 Javascript
微信公众号H5之微信分享常见错误和问题(小结)
2019/11/14 Javascript
vue实现页面切换滑动效果
2020/06/29 Javascript
[47:45]DOTA2-DPC中国联赛 正赛 Phoenix vs Dragon BO3 第一场 2月26日
2021/03/11 DOTA
状态机的概念和在Python下使用状态机的教程
2015/04/11 Python
python批量导入数据进Elasticsearch的实例
2018/05/30 Python
利用Python库Scapy解析pcap文件的方法
2019/07/23 Python
Python 异步协程函数原理及实例详解
2019/11/13 Python
Django框架反向解析操作详解
2019/11/28 Python
python图形开发GUI库pyqt5的基本使用方法详解
2020/02/14 Python
Python爬取新型冠状病毒“谣言”新闻进行数据分析
2020/02/16 Python
Windows系统下pycharm中的pip换源
2020/02/23 Python
python在linux环境下安装skimage的示例代码
2020/10/14 Python
python中用ggplot绘制画图实例讲解
2021/01/26 Python
CSS的pointer-events属性详细介绍(作用和注意事项)
2014/04/23 HTML / CSS
Melijoe美国官网:法国奢侈童装购物网站
2017/04/19 全球购物
武汉瑞得软件笔试题
2015/10/27 面试题
养生餐厅创业计划书范文
2014/03/26 职场文书
人大调研汇报材料
2014/08/14 职场文书
农行心得体会
2014/09/02 职场文书
关于成绩下滑的自我检讨书
2014/09/20 职场文书
表扬稿表扬信的格式及范文
2019/06/24 职场文书
读《解忧杂货店》有感:请相信一切都是最好的安排
2019/11/07 职场文书