Question

我需要解析CSS文件以供选择器使用，并使用Javascript正确找到文件中的所有CSS / CSS3选择器。

例如：

.hello { ... declaration ... }
.world::after { ... declaration ... }
#id1, #id2 { ...declaration... }.top{ ..declaration.. }

我需要获取一个元素数组：[".hello", ".world::after", "#id1", "#id2", ".top"]

谢谢！

Answer 1

您可以使用以下正则表达式来分割文本，从而获得一系列匹配项：

/\{.*?\}|,|\>|\s/g

正则表达式将找到我们不需要的内容：首先是'{'，然后是零个或多个任何字符（非贪心字符）或逗号或'>'或空白。它使用Global falg来捕获所有内容。

然后，您需要用一个空字符串替换那些匹配项，并且有一个选择器数组。

Example:

var css = '.hello { ... declaration ... }\r\n'
    + '.world::after { ... declaration ... }'\r\n'
    + '#id1, #id2 { ...declaration... }.top{ ..declaration.. }';

var selectorArray = css.split(/\{.*?\}|,|\>|\s/g);

您将必须删除数组中的空元素。

使用JavaScript提取所有CSS选择器

1 个答案: