代码之家 › 专栏 › 技术社区 › imvain2

用于从样式中删除高度/宽度的javascript regex

regex javascript

imvain2 · 技术社区 · 6 年前

使用ckeditor中的htmlfilter addrules,我试图从纯文本样式中删除高度/宽度。

它们不会只返回纯文本样式的实际对象,因此我真的不能使用jquery或其他DOM操作工具。

我有下面的regex代码,它成功地删除了高度和宽度,但仍然保留了实际的尺寸。

我对正则表达式不太熟悉,所以我确信它相当简单。只是不确定。

谢谢您。

var str = "width:100px;height:200px;float:left;";
var regex = /(height|width):(?=(.*?);)/gi;
console.log(str.replace(regex,""));

4 回复 | 直到 6 年前

Wiktor StribiÅ¼ew 6 年前

您使用了lookahead,它是一个非消耗模式,即它匹配的文本不会成为整个匹配值的一部分。因此,它不会被移除

使用类似的模式

/(?:height|width):[^;]*;/gi

见 regex demo .

细节

(?:height|width) -A non-capturing group 匹配要么 height 或 width
: -冒号
[^;]* -A negated character class 匹配0+个字符,而不是 ;
; -半结肠。

见JS演示:

var str = "width:100px;height:200px;float:left;";
var regex = /(?:height|width):[^;]*;/gi;
console.log(str.replace(regex,""));

A l w a y s S u n n y 6 年前

一 非正则表达式 解决方案,使用javascript内置方法删除 height/width 从纯文本样式。

function isNotWidthHeight(style) {
  return style.toLowerCase().indexOf("width") === -1 && style.toLowerCase().indexOf("height") === -1 && style;
}

var str = "margin:0 auto;width:100px;height:200px;float:left;";
var array = str.split(';').filter(isNotWidthHeight);
console.log(array.join(';'));

Code Maniac 6 年前

您还需要捕获这些值。 .*? 而不是 (?=(.*?);) 就够了。

var str = "width:100px;height:200px;float:left;";
var regex = /(height|width):.*?;/gi;
console.log(str.replace(regex,""));

GenericUser 6 年前

非常接近,你只需要一个额外的小组和一些事情等待 ; 或者单词边界, \b . 这将获取任何设置,包括 calc 或者任何设置,直到 ; 或内联样式的结尾。

var str = "width:100px;height:200px;float:left;";
var str2 = "width:calc(100vh - 20px);height:100%;float:left;";

var regex = /((width|height):[\s\S]+?;|\b)/gi;
console.log(str.replace(regex,""));
console.log(str2.replace(regex,""));

推荐文章

DotFX · RegEx捕获关键字前但括号后的所有内容

8 月前

user66001 · 正则表达式用于匹配有引号和无引号的文本,并且不匹配任何部分

8 月前

perlchamp · 为什么这也匹配?

8 月前

con · Negative Lookaward在perl正则表达式中不起作用

8 月前

Andrus · 如何在sql中查找第二个匹配项

8 月前

iato · 确保正则表达式不从命名材料中的数字中提取

9 月前

vr8ce · 非成对标记中特定字符的正则表达式

9 月前

MARTIN · 交换第一个和最后一个单词,反转所有中间的字符

9 月前

Carsten · 使用最近的搜索模式更改文本块

9 月前

Eric Marceau · Grep:有没有一种特殊的方法可以将“无字符”作为“字符位置”匹配的置换?

9 月前