当前位置: 首页 > news >正文

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左右添加和修改东西

相关文章:

js遇到需要正则匹配来修改img标签+清除行内样式

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

Vue学习v-if与v-else-if

Vue学习v-if与v-else-if 一、前言1、v-if2、v-else-if3、v-else4、示例 一、前言 v-if 和 v-else-if 是 Vue.js 中用于条件渲染的指令&#xff0c;它们通常与 v-else 一起使用。下面我来详细解释一下它们的用法和区别&#xff1a; 1、v-if 用法&#xff1a;v-if 是一个指令&…...

linux进阶高级配置,你需要知道的有哪些2-firewalld防火墙(一)

1、防火墙的技术上分类&#xff1a; 包过滤&#xff1a;firewalld属于这种 应用代理&#xff1a; 状态检测&#xff1a;ASA 2、firewalld的两种配置模式&#xff1a; 运行时配置 &#xff1a;立即生效 永久配置&#xff1a;重新加载服务生效 3、常用的区域&#xff1a; trust…...

Centos 中如何汉化man命令

刚学Linux&#xff0c;记不住命令和选项&#xff0c;很依赖里面的 man 查看命令&#xff0c;但因为着实看不懂&#xff0c;有没有什么办法把man查看命令的信息改成中文 在CentOS 7中&#xff0c;你可以通过安装man-pages-zh包来获取中文的man手册。以下是具体的步骤&#xff1a…...

原生小程序开发如何使用 tailwindcss

原生小程序开发如何使用 tailwindcss 原生小程序开发如何使用 tailwindcss 前言什么是 weapp-tailwindcss ?0. 准备环境以及小程序项目1. 安装与配置 tailwindcss 0. 使用包管理器安装 tailwindcss1. 在项目目录下创建 postcss.config.js 并注册 tailwindcss2. 配置 tailwind…...

spring alibaba中的seata分布式事务

Seata AT 模式设计思路 一阶段&#xff1a;业务数据和回滚日志记录在同一个本地事务中提交&#xff0c;释放本地锁和连接资源。 核心在于对业务sql进行解决解析&#xff0c;转换成undolog&#xff0c;并同时入库存 二阶段&#xff1a; 提交异步化&#xff0c;非常快速地完成…...

MQTT学习(二)

订阅主题和订阅确认 SUBSCRIBE——订阅主题 之前的CONNECT报文&#xff0c;分为 固定报头&#xff1a;必须存在&#xff0c;用于描述报文信息。里面有指出什么类型的报文&#xff0c;报文的等级。可变报头&#xff1a;不一定存在。主要看什么样子类型的报文。有效载荷部分&a…...

入职Java,不会git被开除了。。。

入职Java&#xff0c;不会git被开除了。。。 文章目录 入职Java&#xff0c;不会git被开除了。。。前言一、Git是什么&#xff1f;二、Git的核心概念三、Git的工作流程四、Git的常用命令五、总结 &#x1f308;你好呀&#xff01;我是 山顶风景独好 &#x1f49d;欢迎来到我的博…...

Mysql 隔离级别

MySQL的事务隔离级别是指在处理并发事务时&#xff0c;为保证数据的一致性和事务的独立性&#xff0c;数据库系统提供的不同级别控制策略。根据ACID特性中的隔离性&#xff08;Isolation&#xff09;&#xff0c;MySQL支持四种标准的事务隔离级别&#xff0c;每种级别有不同的并…...

每日一学—K邻算法:在风险传导中的创新应用与实践价值

文章目录 &#x1f4cb; 前言&#x1f3af; K邻算法的实践意义&#x1f3af; 创新应用与案例分析&#x1f525; 参与方式 &#x1f4cb; 前言 在当今工业领域&#xff0c;图思维方式与图数据技术的应用日益广泛&#xff0c;成为图数据探索、挖掘与应用的坚实基础。本文旨在分享…...

基于Springboot的校园疫情防控信息管理系统(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的校园疫情防控信息管理系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层…...

【C++】内联函数、auto、范围for

文章目录 1.内联函数2.auto关键字2.1auto简介2.2auto的注意事项2.3auto不能推导的场景 3.基于范围的for循环(C11)4.指针空值nullptr(C11) 1.内联函数 概念&#xff1a; 以inline修饰的函数叫做内联函数&#xff0c;编译时C编译器会在调用内联函数的地方展开&#xff0c;没有函…...

Day 46 139.单词拆分

单词拆分 给定一个非空字符串 s 和一个包含非空单词的列表 wordDict&#xff0c;判定 s 是否可以被空格拆分为一个或多个在字典中出现的单词。 说明&#xff1a; 拆分时可以重复使用字典中的单词。 你可以假设字典中没有重复的单词。 示例 1&#xff1a; 输入: s “leet…...

streamlit报错:AxiosError: Request failed with status code 403

解决办法&#xff1a; 步骤一&#xff1a;创建config.toml vi ~/.streamlit/config.toml 步骤二&#xff1a;加入以下内容 [server] enableXsrfProtection false enableCORS false步骤三&#xff1a;重新启动你的streamlit网页...

java基础教学 |Java Stream API详解

Java Stream API 是Java 8引入的一个重要特性&#xff0c;它为集合对象提供了一种新的计算模型&#xff0c;使得开发者能够以声明性的方式处理数据集合。Stream API 不仅提高了代码的可读性和简洁性&#xff0c;还极大地优化了并行处理能力&#xff0c;让复杂的集合操作变得高效…...

0.0和0.00竟然不相等!!!BigDecimal别用错了比较方式

对于BigDecimal字段&#xff0c;可以使用compareTo()方法和equals()方法进行比较。但是要注意这两种方法的作用有所不同。一般都应该使用BigDecimal比较值&#xff0c;而不是使用经常用到的equals方法比较内容。 1.compareTo()方法 是用来比较两个BigDecimal对象的大小关系。…...

【多模态】30、Monkey | 支持大尺寸图像输入的多任务多模态大模型

文章目录 一、背景二、方法2.1 Enhancing Input Resolution2.2 Multi-level Description Generation2.3 Multi-task Training 三、效果3.1 Image Caption3.2 General VQA3.3 Scene Text-centric VQA3.4 Document-oriented VQA3.5 消融实验3.6 可视化 论文&#xff1a;Monkey : …...

PHP黑魔法之md5绕过

php本身是一种弱语言,这个特性决定了它的两个特点: 输入的参数都是当作字符串处理变量类型不需要声明,大部分时候都是通过函数进行类型转化php中的判断有两种: 松散比较:只需要值相同即可,类型不必相同,不通类型比较会先转化为同类型,比如全数字字符串和数字比较,会比…...

【适用全主题】WordPress原创插件:弹窗通知插件 支持内容自定义

内容目录 一、详细介绍二、效果展示1.部分代码2.效果图展示 三、学习资料下载 一、详细介绍 适用于所有WordPress主题的弹窗插件 一款WordPress原创插件&#xff1a;弹窗通知插件 支持内容自定义 二、效果展示 1.部分代码 代码如下&#xff08;示例&#xff09;&#xff1…...

定时器的理论和使用

文章目录 一、定时器理论1.1定时器创建和使用 二、定时器实践2.1周期触发定时器2.2按键消抖 一、定时器理论 定时器是一种允许在特定时间间隔后或在将来的某个时间点调用回调函数的机制。对于需要周期性任务或延迟执行任务的嵌入式应用程序特别有用。 软件定时器&#xff1a; …...

接口测试中缓存处理策略

在接口测试中&#xff0c;缓存处理策略是一个关键环节&#xff0c;直接影响测试结果的准确性和可靠性。合理的缓存处理策略能够确保测试环境的一致性&#xff0c;避免因缓存数据导致的测试偏差。以下是接口测试中常见的缓存处理策略及其详细说明&#xff1a; 一、缓存处理的核…...

云原生核心技术 (7/12): K8s 核心概念白话解读(上):Pod 和 Deployment 究竟是什么?

大家好&#xff0c;欢迎来到《云原生核心技术》系列的第七篇&#xff01; 在上一篇&#xff0c;我们成功地使用 Minikube 或 kind 在自己的电脑上搭建起了一个迷你但功能完备的 Kubernetes 集群。现在&#xff0c;我们就像一个拥有了一块崭新数字土地的农场主&#xff0c;是时…...

Cursor实现用excel数据填充word模版的方法

cursor主页&#xff1a;https://www.cursor.com/ 任务目标&#xff1a;把excel格式的数据里的单元格&#xff0c;按照某一个固定模版填充到word中 文章目录 注意事项逐步生成程序1. 确定格式2. 调试程序 注意事项 直接给一个excel文件和最终呈现的word文件的示例&#xff0c;…...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

页面渲染流程与性能优化

页面渲染流程与性能优化详解&#xff08;完整版&#xff09; 一、现代浏览器渲染流程&#xff08;详细说明&#xff09; 1. 构建DOM树 浏览器接收到HTML文档后&#xff0c;会逐步解析并构建DOM&#xff08;Document Object Model&#xff09;树。具体过程如下&#xff1a; (…...

Rapidio门铃消息FIFO溢出机制

关于RapidIO门铃消息FIFO的溢出机制及其与中断抖动的关系&#xff0c;以下是深入解析&#xff1a; 门铃FIFO溢出的本质 在RapidIO系统中&#xff0c;门铃消息FIFO是硬件控制器内部的缓冲区&#xff0c;用于临时存储接收到的门铃消息&#xff08;Doorbell Message&#xff09;。…...

Typeerror: cannot read properties of undefined (reading ‘XXX‘)

最近需要在离线机器上运行软件&#xff0c;所以得把软件用docker打包起来&#xff0c;大部分功能都没问题&#xff0c;出了一个奇怪的事情。同样的代码&#xff0c;在本机上用vscode可以运行起来&#xff0c;但是打包之后在docker里出现了问题。使用的是dialog组件&#xff0c;…...

Go 语言并发编程基础:无缓冲与有缓冲通道

在上一章节中&#xff0c;我们了解了 Channel 的基本用法。本章将重点分析 Go 中通道的两种类型 —— 无缓冲通道与有缓冲通道&#xff0c;它们在并发编程中各具特点和应用场景。 一、通道的基本分类 类型定义形式特点无缓冲通道make(chan T)发送和接收都必须准备好&#xff0…...

【Redis】笔记|第8节|大厂高并发缓存架构实战与优化

缓存架构 代码结构 代码详情 功能点&#xff1a; 多级缓存&#xff0c;先查本地缓存&#xff0c;再查Redis&#xff0c;最后才查数据库热点数据重建逻辑使用分布式锁&#xff0c;二次查询更新缓存采用读写锁提升性能采用Redis的发布订阅机制通知所有实例更新本地缓存适用读多…...

GitHub 趋势日报 (2025年06月06日)

&#x1f4ca; 由 TrendForge 系统生成 | &#x1f310; https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日获星趋势图 今日获星趋势图 590 cognee 551 onlook 399 project-based-learning 348 build-your-own-x 320 ne…...