Javascript RegExp未知重复匹配

Question

很难描述，因为我不是正则表达式方面的专家。所以我告诉你我的案子。

在HTML中，希望将class属性贡献到不同的data-xyz属性中。问题是每次比赛总是得到所有的类。例如，以下HTML：

<span class="note-123 index-3 green">Hello</span> <span class="index-456 red">World<span>

到目前为止，我的正则表达式是/<span class="([^\"\s]*)\s*/，它与第一个类匹配。在本例中，note-123和index-456

但是，如果我想获得每个元素的所有类，我可以使用/<span class="([^\"\s]*)\s*([^\"\s]*)\s*([^\"\s]*)\s*/。直到三个类和第二个类的结果返回index-456、red和空字符串为止。

无论有多少类，是否都有可能每次匹配获得所有的类？类似于Javascript中的嵌套循环吗？

我很高兴能得到你们的帮助。

Answer 1

您可以在不使用正则表达式的情况下获得类，使用querySelectorAll查找所需的元素，并使用classList获取类名。

然后使用例如添加或删除方法。

或者使用DOMParser。

Note关闭最后一个跨度。

​

let elms = document.querySelectorAll("span");
elms.forEach(e => {
  for (let value of e.classList.values()) {
    console.log(value);
  }
});

<span class="note-123 index-3 green">Hello</span> <span class="index-456 red">World</span>

​