通过名称以编程方式获取FontAwesome unicode值

本文介绍了通过名称以编程方式获取FontAwesome unicode值的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

按照此答案中所述的步骤，我将光标设置为FontAwesome图标。现在，我想将光标设置为任何图标，按类名（例如， fa-pencil ）。 要完成这一点，看起来我需要能够以编程方式查找给定图标的unicode值。

Following the steps outlined in this answer, I am setting my cursor to a FontAwesome icon. Now, I would like to set the cursor to any icon, by class name (for example, fa-pencil). To accomplish this, it seems like I would need to be able to programmatically lookup the unicode value of a given icon.

我知道这些值列在 font-awesome.css 样式表中，但我想避免

I know that these values are listed in the font-awesome.css stylesheet, but I would like to avoid parsing that file, if another method exists.

这是否可能？

推荐答案

我已经聚集在一起工作的东西：

I have kludged together something that works:

var setCursor = function (icon) { var tempElement = document.createElement("i"); tempElement.className = icon; document.body.appendChild(tempElement); var character = window.getComputedStyle( document.querySelector('.' + icon), ':before' ).getPropertyValue('content'); tempElement.remove(); var canvas = document.createElement("canvas"); canvas.width = 24; canvas.height = 24; var ctx = canvas.getContext("2d"); ctx.fillStyle = "#000000"; ctx.font = "24px FontAwesome"; ctx.textAlign = "center"; ctx.textBaseline = "middle"; ctx.fillText(character, 12, 12); var dataURL = canvas.toDataURL('image/png') $('body').css('cursor', 'url('+dataURL+'), auto'); }

这将创建一个临时元素与给定的类，然后使用 window.getComputedStyle 来捕获：before 伪元素的内容。

This creates a temporary element with the given class, then uses window.getComputedStyle to grab the content of the :before pseudo-element.

感谢大家的帮助！