Question

我在页面上有大约250个字体图标，我想以编程方式提取每个图标的Unicode值。

典型的图标具有相应的CSS，如下所示：

.icon-play:before {
    content: "\f04b";
}

到目前为止我尝试了什么......

document.querySelectorAll('[class^=icon-]')访问图标（暂时调用每个i）。 i.style尝试访问样式对象。问题是i.style.content值为空。

我也试图以这种方式document.querySelectorAll('[class^=icon-]:before')访问内容，但这会产生空结果。

感谢任何帮助。感谢。

Answer 1

你走了：

var is = document.querySelectorAll('[class^=icon-]');
[].forEach.call(is, function (i) {
    console.log(
        window.getComputedStyle(i, ':before').content.slice(1, -1) // Strip off surrounding quotes
    );
});

JSFiddle（为了在视觉上显示结果，增加了一些复杂性）

就提取Unicode值而言，您没有指定所需的格式（除非您只是想抓取字符串内容），但如果您需要代码点，则可以将charCodeAt()应用于每个字符上面的字符串可以找到他们的代码点并按照您的意愿使用它们。

在a：伪选择器上访问样式属性“content”

1 个答案: