如何在 JS 中使用正则表达式获取字体系列的子字符串

Question

我正在尝试从表示 html 部分的字符串中获取字体系列。字体系列可以是任何字体，这就是我考虑使用正则表达式的原因。字符串也可以是 x 个字符。输入示例为：

'<body id="foo" class="bar"><span style="color: #d4d4d4;background-color: #1e1e1e;font-family: Consolas">Example Text</span></body>'

理想的结果是“Consolas”。但是我不太擅长正则表达式，无法想出合适的正则表达式。

数据以元素的字符串表示形式出现

解决方案： 感谢 terrymorse（评论）和 Gerardo Cabrera（接受的答案）！我不知道如何将 html 字符串转换为元素。能够根据他们的反馈提取字体系列

Answer 1

正如大家所说，使用正则表达式来尝试解析 HTML 并不是一个好主意。只需像这样使用 DOM：

// Like the user   terrymorse   did
let div = document.createElement('div'); 
div.innerHTML = '<body id="foo" class="bar"><span style="color: #d4d4d4;background-color: #1e1e1e;font-family: Consolas">Example Text</span></body>';

let children = div.children;

console.log(children[0].style.fontFamily);

您也可以使用拆分和数组函数来找到这样的属性，但是 DOM 选项更好。

var s = '<body id="foo" class="bar"><span style="color: #d4d4d4;background-color: #1e1e1e;font-family: Consolas">Example Text</span></body>';

var x = s.split(";");
var y = x.filter(e => e.includes("font-family"))[0].split('"')[0];
 
var result = y.replace("font-family: ", "");

console.log(result)

如何在 JS 中使用正则表达式获取字体系列的子字符串

How to get substring of font family using regex in JS

javascript

regex

string

substring

font-family