javascript - 具有 css 属性的正则表达式

Question

我有带有 css 属性及其值的字符串：

str = "filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000');
       background: -webkit-linear-gradient(top, black, white);
       animation-duration: 12s;";

我想我的比赛只返回属性

properties = text.match(/[^;:]*:/g); 

但它也返回“progid：”，我该如何避免它？

Answer 1

搜索行首或“;” 以及（或者可能是换行符/制表符，具体取决于您的字符串格式）：

/(^|;)[^:;]*:/

不过，您仍然需要稍微清理一下结果。

或者，您可以将字符串拆分为“;” 首先，然后在“：”上拆分每个位，并为您的属性获取每个位的第 0 个成员：

var str = "filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000');background: -webkit-linear-gradient(top, black, white);animation-duration: 12s;";

var rules = str.split(";")

var i, l = rules.length;

var properties = [];

for( i = 0; i < l; i++ ){
    properties.push( rules[ i ].split(":")[0] ); //dangerous if you're not sure you'll always have a result
}

Answer 2

请试试

properties = text.match(/^[^;:]*:/g); 

编辑：这是一个更好的解决方案，前提是属性和值之间总是有空格：

properties = text.match(/[^ ;:]+(?=: )/g)

Answer 3

为了避免在以字符串结尾的半边分割时出现空规则，

拆分半决赛，内容紧随其后；

var rules= str.split(/;(?=\S+)/);

for(var i= 0, L= rules.length; i<L; i++){
    rules[i]= rules[i].split(':')[0];   
}

/* 
alert(rules)>>(Array)
filter, background, animation-duration
*/