Font awesome 5 侦听未知图标

Question

我在我的网站上使用字体 awesome 5。假设我拼错了这样一个图标：

<i class="fa fa-map-markerzzzz"></i>

Font Awesome 代码必须在显示时检测到它是一个未知图标？和！符号。

知道如何收听吗？我想添加错误报告。我们有一个错误记录系统，我想为每个损坏的图标发送一个错误。

知道怎么做吗？

Answer 1

FontAwesome 检测不到这一点，因为它是由字体文件而不是一段代码支持的 CSS 类的集合。因此，很遗憾，没有您可以侦听的错误事件。

类似的问题，但不是针对 FontAwesome。看来您最好的选择是检索现有 FontAwesome 类的列表，然后将它们与代码中使用的类进行比较。

如果您使用 Angular 或 React，您可以将 FontAwesome 图标包装在一个组件中并在那里进行错误检查。

Answer 2

你可以这样做：

<style>
.fa:before {
  content:"?"; /*if the content exist it will be replaced later, if not you will see this*/
}

</style>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" >
<i class="fa fa-map-markerzzzz"></i>
<i class="fa fa-user"></i>

Font awesome 5 侦听未知图标

Font awesome 5 listen for unknown icons

css

font-awesome-5