JavaScript 正则表达式从 HTML 样式标签中提取文本

Question

我正在尝试 JavaScript RegEx 提取 CSS HTML 标记之间的所有文本:

 var rawHtml = "<style type='text/css'> div { color: red; } </style>";
 //var rawHtml = "<style type=\"text/css\"> div { color: red; } </style>";
 //var rawHtml = "<style> div { color: red; } </style>";
 var cssString = rawHtml.match(/<style[^>]*>(.+?)<\/style>/gi);
 console.log(cssString);

样式标记可以具有属性以及单引号或双引号。如何成功提取所有用例？我的正则表达式没有接收到它。

Answer 1

只需使用 DOMParser 即可:

const rawHTML = "<style type='text/css'> div { color: red; } </style>";
const doc = new DOMParser().parseFromString(rawHTML, "text/html");
const matches = [...doc.querySelectorAll('style')]
  .map(style => style.textContent);
console.log(matches);