(富文本常用)js遇到需要正则匹配来修改img标签+清除行内样式

简介: (富文本常用)js遇到需要正则匹配来修改img标签+清除行内样式

方法一、

var regex0 = new RegExp("(i?)(\<img)([^\>]+\>)", "gmi") //正则匹配表达式
this.newcontent = this.content.replace(regex0,"$2 style='display:block;margin: auto;width:120px;' $3")
//下面这个则需要在$2 $3左右添加和修改东西

这个正则表达式就是匹配所有的img标签//踩坑完毕,可以直接使用


第二行代码按自己需要改改


方法二、

遇到特殊的情况就是自带样式,那么方法一就不能用了,因为只会算是从原有字符串上面多加字符串


所以第一步,清楚原有行内样式

var regex0 = new RegExp("(i?)(\<img)([^\>]+\>)", "gmi") //正则匹配表达式
this.articleContent=this.articleContent.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
this.articleContent = this.articleContent.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
this.articleContent = this.articleContent.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');

第二步、清楚完所有的行内样式以后,再继续进行从新赋值行内样式

var regex0 = new RegExp("(i?)(\<img)([^\>]+\>)", "gmi") //正则匹配表达式
this.newcontent = this.content.replace(regex0,"$2 style='display:block;margin: auto;width:120px;' $3")
//下面这个则需要在$2 $3左右添加和修改东西


目录
相关文章
|
3月前
|
前端开发 JavaScript
纯样式或使用JS的canvas实现图片旋转
纯样式或使用JS的canvas实现图片旋转
31 0
|
5月前
|
JavaScript 小程序
小程序JS动态修改样式vv
小程序JS动态修改样式
152 0
|
5月前
|
JavaScript 前端开发
JavaScript jQuery修改样式
JavaScript jQuery修改样式
|
1月前
|
JavaScript 前端开发
js的input标签上传图片并转为base64预览
js的input标签上传图片并转为base64预览
29 0
|
1月前
|
前端开发 开发者
编程笔记 html5&css&js 017 HTML样式
编程笔记 html5&css&js 017 HTML样式
|
6月前
|
JavaScript 前端开发 Windows
VScode的注释和标题,标签,img的src属性(如何网页上插入图片)(Mac如何开启js控制台)(如何免费复制网页中的文字)
VScode的注释和标题,标签,img的src属性(如何网页上插入图片)(Mac如何开启js控制台)(如何免费复制网页中的文字)
|
2月前
|
移动开发 前端开发 JavaScript
H5+CSS3+JS逆向前置——HTML2、table表格标签
H5+CSS3+JS逆向前置——HTML2、table表格标签
26 0
|
3月前
|
JavaScript 前端开发 UED
探究: 为什么JavaScript要在body标签尾部引入?
探究: 为什么JavaScript要在body标签尾部引入?
26 0
|
3月前
|
前端开发 JavaScript
分享几个精美的网页按钮样式,纯CSS实现,无JS(拿来即用)
分享几个精美的网页按钮样式,纯CSS实现,无JS(拿来即用)
35 0
|
3月前
|
JavaScript
JS中给绑定的点击事件添加显示样式后不生效?
JS中给绑定的点击事件添加显示样式后不生效?