js正则匹配markdown里的图片标签的实现

其实前端后端需要将markdown文本转换为html文本都有相应的库,几句代码就ok,但有时我们又必须获取到markdown里的某个标签来进行相应的转换,有几种办法,可以从已经转换好的html文本里获取,还有的就是直接从markdown文本里获取,这里说的是第二种。

Posted in Javascript onMarch 24, 2021

1. 一个markdown里只有一个图片的情况

const str = "asddsad![标题](url)asdasddasd"; //一段markdown文本,包含一个图片"![标题](url)"
let result = str.match(/!\[(.*?)\]\((.*?)\)/); //直接查找
console.log(result); 

运行结果

js正则匹配markdown里的图片标签的实现

2. 一个markdown里有多个图片的情况

const str = "asghfj![标题1](url1)gfhasfr![标题2](url2)sadas";
const pattern = /!\[(.*?)\]\((.*?)\)/mg;
let matcher;
 
while ((matcher = pattern.exec(str)) !== null) {
  console.log(matcher);
}

运行结果

js正则匹配markdown里的图片标签的实现

每个结果都有相应的原文以及原文所在位置,如果要做替换直接就可以替换了,参照如下方法

//最简单的替换
"123".replace('1','a'); //把1替换为a

 

Javascript 相关文章推荐
JS版网站风格切换实例代码
Oct 06 Javascript
基于jquery的修改当前TAB显示标题的代码
Dec 11 Javascript
JavaScript简单实现鼠标移动切换图片的方法
Feb 23 Javascript
如何使用JS在HTML中自定义字符串格式化
Jul 20 Javascript
解决vue多个路由共用一个页面的问题
Mar 12 Javascript
微信小程序仿美团城市选择
Jun 06 Javascript
js实现图片上传并预览功能
Aug 06 Javascript
详解mpvue scroll-view自动回弹bug解决方案
Oct 01 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
Sep 28 Javascript
详解Vue.js 响应接口
Jul 04 Javascript
使用webpack5从0到1搭建一个react项目的实现步骤
Dec 16 Javascript
vue 数据双向绑定的实现方法
Mar 04 Vue.js
浅谈react路由传参的几种方式
Mar 23 #Javascript
一百多行代码实现react拖拽hooks
node中使用shell脚本的方法步骤
详解如何解决使用JSON.stringify时遇到的循环引用问题
vue 中 get / delete 传递数组参数方法
Mar 23 #Vue.js
JavaScript实现页面动态验证码的实现示例
使用Vue.js和MJML创建响应式电子邮件
You might like
php 正确解码javascript中通过escape编码后的字符
2010/01/28 PHP
Laravel项目中timeAgo字段语言转换的改善方法示例
2019/09/16 PHP
实现复选框全选/全不选切换
2006/12/23 Javascript
由点击页面其它地方隐藏div所想到的jQuery的delegate
2013/08/29 Javascript
js读取注册表的键值示例
2013/09/25 Javascript
jQuery javascript获得网页的高度与宽度的实现代码
2016/04/26 Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
2016/08/04 Javascript
JS判断form内所有表单是否为空的简单实例
2016/09/09 Javascript
原生javascript实现图片放大镜效果
2017/01/18 Javascript
详解Vue使用 vue-cli 搭建项目
2017/04/20 Javascript
用js将long型数据转换成date型或datetime型的实例
2017/07/03 Javascript
webpack 插件html-webpack-plugin的具体使用
2018/04/09 Javascript
jQuery实现简单复制json对象和json对象集合操作示例
2018/07/09 jQuery
elementUI Vue 单个按钮显示和隐藏的变换功能(两种方法)
2018/09/04 Javascript
基于ssm框架实现layui分页效果
2019/07/27 Javascript
jquery实现弹窗(系统提示框)效果
2019/12/10 jQuery
让python的Cookie.py模块支持冒号做key的方法
2010/12/28 Python
Python中异常重试的解决方案详解
2017/05/05 Python
关于pip的安装,更新,卸载模块以及使用方法(详解)
2017/05/19 Python
Python开发的十个小贴士和技巧及长常犯错误
2018/09/27 Python
python处理multipart/form-data的请求方法
2018/12/26 Python
python实现批量nii文件转换为png图像
2019/07/18 Python
Python 3.8 新功能全解
2019/07/25 Python
基于Python中的yield表达式介绍
2019/11/19 Python
python 实现快速生成连续、随机字母列表
2019/11/28 Python
Python使用configparser读取ini配置文件
2020/05/25 Python
python制作微博图片爬取工具
2021/01/16 Python
css3实现一个div设置多张背景图片及background-image属性实例演示
2017/08/10 HTML / CSS
Avène雅漾美国官方网站:敏感肌肤护理专家
2016/10/24 全球购物
Joules官网:女士、男士和儿童服装和鞋类
2018/10/23 全球购物
沃达丰英国有限公司:Vodafone英国
2019/04/16 全球购物
《列夫托尔斯泰》教学反思
2014/02/10 职场文书
本科毕业生求职自荐信
2014/04/09 职场文书
社区党支部承诺书
2015/04/29 职场文书
一次Mysql update sql不当引起的生产故障记录
2022/04/01 MySQL
springboot创建的web项目整合Quartz框架的项目实践
2022/06/21 Java/Android