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 相关文章推荐
Jquery实现自定义窗口随意的拖拽
Mar 12 Javascript
jQuery淡入淡出元素让其效果更为生动
Sep 01 Javascript
JavaScript中判断整数的多种方法总结
Nov 08 Javascript
基于Bootstrap+jQuery.validate实现Form表单验证
Dec 16 Javascript
解决jquery中动态新增的元素节点无法触发事件问题的两种方法
Oct 30 Javascript
JavaScript计划任务后台运行的方法
Dec 18 Javascript
微信小程序进行微信支付的步骤昂述
Dec 01 Javascript
微信小程序 flex实现导航实例详解
Apr 26 Javascript
JavaScript实现HTML5游戏断线自动重连的方法
Sep 18 Javascript
解决vue打包后刷新页面报错:Unexpected token
Aug 27 Javascript
es6函数之箭头函数用法实例详解
Apr 25 Javascript
解决vant-UI库修改样式无效的问题
Nov 03 Javascript
浅谈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 页面执行时间计算代码
2008/12/04 PHP
PHP 读取文件内容代码(txt,js等)
2009/12/06 PHP
php设计模式 Observer(观察者模式)
2011/06/26 PHP
php使用array_rand()函数从数组中随机选择一个或多个元素
2014/04/28 PHP
windows8.1下Apache+Php+MySQL配置步骤
2015/10/30 PHP
简单谈谈PHP中strlen 函数
2016/02/27 PHP
Zend Framework教程之Zend_Config_Xml用法分析
2016/03/23 PHP
JavaScript 对象模型 执行模型
2009/12/06 Javascript
jquery 实现checkbox全选,反选,全不选等功能代码(奇数)
2012/10/24 Javascript
javascript内存管理详细解析
2013/11/11 Javascript
jquery重复提交请求的原因浅析
2014/05/23 Javascript
jQuery实现简单的文件上传进度条效果
2020/03/26 Javascript
Javascript 实现计算器时间功能详解及实例(二)
2017/01/08 Javascript
jQuery实现级联下拉框实战(5)
2017/02/08 Javascript
jQuery动态移除和添加背景图片的方法详解
2017/03/07 Javascript
vue使用echarts图表的详细方法
2018/10/22 Javascript
详解关于微信setData回调函数中的坑
2019/02/18 Javascript
Vue-cli3.X使用px2 rem遇到的问题及解决方法
2019/08/08 Javascript
JavaScript实现省市区三级联动
2020/02/13 Javascript
python多进程操作实例
2014/11/21 Python
pandas.dataframe中根据条件获取元素所在的位置方法(索引)
2018/06/07 Python
python去除文件中重复的行实例
2018/06/29 Python
Django restframework 源码分析之认证详解
2019/02/22 Python
Python ArgumentParse的subparser用法说明
2020/04/20 Python
python 实现图片裁剪小工具
2021/02/02 Python
彼得罗夫美国官网:Peter Thomas Roth美国(青瓜面膜)
2017/11/05 全球购物
怀旧香味蜡烛:Homesick
2019/11/02 全球购物
澳大利亚体育和露营装备在线/实体零售商:Find Sports
2020/06/03 全球购物
计算机网络专业求职信
2014/06/05 职场文书
民主评议政风行风活动心得体会
2014/10/29 职场文书
2014小学年度工作总结
2014/12/20 职场文书
郭明义观后感
2015/06/08 职场文书
餐厅营销的秘密:为什么老顾客会流水?
2019/08/08 职场文书
二手手机买卖合同范本(2019年版)
2019/10/28 职场文书
Linux安装Nginx步骤详解
2021/03/31 Servers
如何优化vue打包文件过大
2022/04/13 Vue.js