正则替换HTML里的style属性
一个网友问:
<p class="a" style="font-size: 12pt; font-family: ""; color: red;">a</p>
如何替换成:
<p class="a" >a</p>
以为So easy,写个正则匹配一下就OK了,
/style="[^"]*?"/g
结果生成结果如下:
<p class="a" "; color: red;">a</p>
原来忽略了style="中间有双引号"
琢磨后,
改进了正则表达式:
var a=`<p class="a" style="font-size: 12pt; font-family: ""; color: red;">a</p>`
var reg4 = /style="[^=]*?"([(\s+\w+=)|>])/g
a.replace(reg4,'$1')
最终生成结果:
<p class="a" >a</p>
"和>之间还多了一个空格。基本上达到了要求。
原理,style后的内容非贪婪匹配,以一个=号或是>号结尾,后面那部分要用分组($1)替换回来
20190107,反馈有问题,改进:
var reg4 = /style="[^=>]*"([(\s+\w+=)|>])/g
a.replace(reg4,'$1')
把非贪婪匹配改为了贪婪匹配。
正则替换HTML里的style属性的更多相关文章
- dede文章调用时过滤调 body里面的style属性和值
dede 发布文章的时候会在里面的标签中添加一些style 属性,现在改网站想去掉这些属性和里面的值,因为文章太多所以就用下面的方法 \include\arc.listview.class.php 在 ...
- 在v-html中,js 正则表达式清除字符串里的style属性
项目中遇到这样的需求,后端返回的是字符串,在vue用v-html显示,里面有style样式,要去除style 在v-html中使用filters,和平时的不一样,推荐项目的方法,定义一个全局的过滤方法 ...
- JavaScript之Style属性学习
当CSS使用伪类开始侵入DOM和JavaSCript所控制着的行为层时,DOM和JavaScript也使用他们的一系列样式去控制表现层,这篇随笔主要说的就是利用JavaScript去控制元素的表现形式 ...
- CSS用HTML中的style属性替换
废话不多说上代码: 1.用CSS给文字添加背景色: <html> <head> <style type="text/css"> body {ba ...
- php中的正则函数:正则匹配,正则替换,正则分割 所有的操作都不会影响原来的字符串.
有一个长期的误解, 如果要分组, 必须用 小括号 和 |, 而不能用 中括号 和 |. [ab|AB]表示的不是 匹配 ab或 AB, 而是表示 匹配 a,b, |, A, B 这5个字符中 的任意 ...
- js外部样式和style属性的添加移除
在页面中,往往一个控件的外部样式或者内部样式往往不只一个,而我们只需操作其中一个样式该怎么办呢? 最开始我也不知道该怎么做,就用了最原始的方法,替换原有的样式为新的样式,这样每次都要获取原样式,找通用 ...
- php中的正则函数主要有三个-正则匹配,正则替换
php中变量的声明? 由于php声明变量的时候, 不支持使用 var关键字, 又不能直接写一个变量名字, 孤零零的放在那里, 所以, 在php中声明变量的方式, 同时也是给变量初始化的形式, 即: & ...
- PHP函数preg_replace() 正则替换所有符合条件的字符串
PHP preg_replace() 正则替换,与JavaScript 正则替换不同,PHP preg_replace() 默认就是替换所有符号匹配条件的元素. preg_replace (正则表达式 ...
- css字体样式(Font Style),属性
css字体样式(Font Style),属性 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...
随机推荐
- struts2之数据校验
概述 在提交表单数据时,如果数据需要保存到数据库,空输入等可能会引发一些异常,为了避免引起用户的输入引起底层异常,通常在进行业务逻辑操作之前,先执行基本的数据校验. 下面通过四种方式来阐述Struts ...
- UML与软件建模:第二次作业(类图中类的表示)
一.类图 (1)类图定义 类图,是UML(统一建模语言)中用于描述"类"以及"类与类"之间的示意图.它形象的描述出了系统的结构,帮助人们理解系统. 类图是在&q ...
- placeholder是H5的一个新属性,但是在IE9以下是不支持的
$(function() { // 如果不支持placeholder,用jQuery来完成 if(!isSupportPlaceholder()) { // 遍历所有input对象, 除了密码框 $( ...
- webSocket的 原理 及 实现
websocket协议是基于Tcp的一种新的网络协议,它实现了客户端与服务器的双向通行,并允许服务端主动发送信息给客户端.WebSocket是html5中的协议. Http协议与WebSocket协议 ...
- 利用div+css实现九宫格,然后用js实现点击每个格子可以随机更改格子(div)的背景颜色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- SQL Server DDL
1:向表中添加字段 Alter table [表名] add [列名] 类型 2: 删除字段 Alter table [表名] drop column [列名] 3: 修改表中字段类型 (可以修 ...
- centos下搭建openstack的环境
一.准备环境 linux (centos 7.2(C300的虚机) ) java1.8 官网下载tar包 安装前设置环境变量 JAVA_HOME=/usr/lib/jvm/java-1.8.0-ope ...
- vi编辑器之删除操作
参见 1.vi列删除 方法一: ctrl+v进入列编辑模式: 将光标定位子想要删除的起始列: 移动光标至结束列(直接通过移动光标选中,对列不对齐时,可能比较长的行,无法全部选中,尤其是需要一直删除到行 ...
- UnicodeDecodeError: 'gbk' codec can't decode byte 0xae in position 199: illegal multibyte sequence
=================================版权声明================================= 版权声明:原创文章 谢绝转载 请通过右侧公告中的“联系邮 ...
- linux执行python的脚本文件,提示提示No such file or directory
在window平台下,写好python脚本文件,迁移到linux平台,赋过可执行权限,执行该sh文件,却提示No such file or directory.ls 了下,确实有该文件,怎么会事呢, ...