Question

我想用空格和特殊字符来放置文本，但我想保留这些字符。我要分开的文字是CSS格式。请看以下示例：

.box {
  background: red;
  color: white;
}

我已经按行格式化了这个

[ " .box { " ]
[ " background: red; " ]
[ " } " ]
[ " color: white; " ]

我希望按空格分割每个字符串和这些字符＆＃39;：＆＃39;和＆＃39;;＆＃39;

所以我会用这样的东西：

[".box"] ["{"]
["background"] [":"] ["red"] [";"]
["color"] [":"] ["white"] [";"]
["}"]

我想记住语法，这里有一些可能的场景：

background: red;          -> ["background"] [":"] ["red"] [";"]
background      : red ;   -> ["background"] [":"] ["red"] [";"]
backg    round : red ;    -> ["backg"] ["round"] [":"] ["red"] [";"]

提前致谢！

修改

关于重复的问题，我正在查看其他帖子的答案，这可能对我的具体情况有所帮助，但是所讨论的问题可能在解析CSS之外的其他上下文中。请考虑一下，谢谢你的参考。

Answer 1

也许是这样的

＆＃13;

var originalText = `.box {
  background: red;
  color: white;
}`;

var parsed = originalText
              .split(/( |:|;|\n)/g) // split and maintain by using capturing group
              .filter(p=>p.trim()); // keep only non whitespace elements

console.log(parsed);

＆＃13;

Answer 2

你可以通过循环数组元素并使用此正则表达式调用.match()：/(\[\.\#\]?\[a-z\]+\[\s?>+~\s?\[a-z\]+\]?)|(\[{:};\])|(\[a-z0-9\]+)/gi来获取所有单独的元素：

var results = [];
arr.forEach(function(a) {
  a[0].match(/([\.\#]?[a-z]+[\s?>+~\s?[a-z]+]?)|([{:};])|([a-z0-9]+)/gi).forEach(function(m) {
    results.push(m);
  });
});

您可以测试Regex here，看它是否与所有CSS选择器匹配。

<强>演示：

＆＃13;

var arr = [
  [" .box { "],
  [" background: red; "],
  [" } "],
  [" color: white; "]
];

var results = [];
arr.forEach(function(a) {
  a[0].match(/([\.\#]?[a-z]+[\s?>+~\s?[a-z]+]?)|([{:};])|([a-z0-9]+)/gi).forEach(function(m) {
    results.push(m);
  });
});
console.log(results);

＆＃13;

按空格或字符分隔文字并包含字符

2 个答案: