从类名访问 FontAwesome unicode答案

【问题标题】：Access FontAwesome unicode from class name从类名访问 FontAwesome unicode
【发布时间】：2017-09-18 12:52:40
【问题描述】：

在检查元素时，假设我有这个 HTML。

<i class="fa fa-user">
   ::before
</i>

CSS：

.fa-user::before {
    content: "\f007";
}

这里我正在获取fa-user的内容

    $('.fa-user').each(function(){
        var unicode = window.getComputedStyle(this,':before').content;
        console.log(unicode);
    });

问题在于 unicode 变量呈现为图标（符号）。

我希望它是字符串 -> "\f007"

我也试过这个，但它只是返回一些不相关的数字，在这种情况下它是数字 22

var unicode = window.getComputedStyle(this,':before').content.charCodeAt(0).toString(16);

【问题讨论】：

标签： javascript jquery unicode

【解决方案1】：

某些浏览器将 .content 值用引号 (see here) 括起来。您需要在获取第一个字符之前删除它们：

$('.fa-user').each(function() {
  var unicode = window.getComputedStyle(this, ':before').content
                                                        .replace(/'|"/g, '') // <-----
                                                        .charCodeAt(0)
                                                        .toString(16);
  console.log("\\" + unicode);
});

.fa-user::before { content: "\f007"; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<i class="fa fa-user"></i>

【讨论】：

正是我需要的。谢谢！