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 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
Dec 25 Javascript
Mootools 1.2教程 定时器和哈希简介
Sep 15 Javascript
Jquery插件之多图片异步上传
Oct 20 Javascript
基于JQuery制作的产品广告效果
Dec 08 Javascript
使用GruntJS构建Web程序之构建篇
Jun 04 Javascript
JavaScript控制table某列不显示的方法
Mar 16 Javascript
bootstrap日期控件问题(双日期、清空等问题解决)
Apr 19 Javascript
详解从Vue-router到html5的pushState
Jul 21 Javascript
简单易扩展可控性强的Jquery转盘抽奖程序
Mar 16 jQuery
vue router总结 $router和$route及router与 router与route区别
Jul 05 Javascript
vue实现分页加载效果
Dec 24 Javascript
微信小程序轮播图swiper代码详解
Dec 01 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
dedecms中显示数字验证码的修改方法
2007/03/21 PHP
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
ThinkPHP表单自动验证实例
2014/10/13 PHP
php生成zip文件类实例
2015/04/07 PHP
Yii2.0表关联查询实例分析
2016/07/18 PHP
Laravel框架用户登陆身份验证实现方法详解
2017/09/14 PHP
laravel 框架执行流程与原理简单分析
2020/02/01 PHP
javascript dom 操作详解 js加强
2009/07/13 Javascript
禁止选中文字兼容IE、Chrome、FF等
2013/09/04 Javascript
jquery使用淘宝接口跨域查询手机号码归属地实例
2013/11/28 Javascript
jquery 操作iframe的几种方法总结
2013/12/13 Javascript
javascript读取xml实现javascript分页
2013/12/13 Javascript
一个JavaScript处理textarea中的字符成每一行实例
2014/09/22 Javascript
利用JS生成博文目录及CSS定制博客
2016/02/10 Javascript
微信小程序 Record API详解及实例代码
2016/09/30 Javascript
基于vue实现swipe分页组件实例
2017/05/25 Javascript
vue 挂载路由到头部导航的方法
2017/11/13 Javascript
JS函数节流和函数防抖问题分析
2017/12/18 Javascript
微信小程序实时聊天WebSocket
2018/07/05 Javascript
JavaScript 自定义html元素鼠标右键菜单功能
2019/12/02 Javascript
微信小程序动态添加和删除组件的现实
2020/02/28 Javascript
Python实例一个类背后发生了什么
2016/02/09 Python
Python常用的爬虫技巧总结
2016/03/28 Python
浅析python3字符串格式化format()函数的简单用法
2018/12/07 Python
python绘制已知点的坐标的直线实例
2019/07/04 Python
Python高级特性之闭包与装饰器实例详解
2019/11/19 Python
详解CSS3的perspective属性设置3D变换距离的方法
2016/05/23 HTML / CSS
碧欧泉法国官网:Biotherm法国
2019/10/23 全球购物
设计模式的基本要素是什么
2014/04/21 面试题
毕业生自荐信的主要内容
2013/10/29 职场文书
医药专业推荐信
2013/11/15 职场文书
2014年质检员工作总结
2014/11/18 职场文书
2015年档案管理员工作总结
2015/05/13 职场文书
浅谈mysql执行过程以及顺序
2021/05/12 MySQL
MySQL数据库中varchar类型的数字比较大小的方法
2021/11/17 MySQL
剑指Offer之Java算法习题精讲二叉树的构造和遍历
2022/03/21 Java/Android