Font Awesome 和 Unicode 字符实现答案

【问题标题】：Font Awesome and Unicode Characters MaterializeFont Awesome 和 Unicode 字符实现
【发布时间】：2017-09-02 08:38:55
【问题描述】：

我正在使用谷歌的 css 框架物化，这非常好。

这个框架有它自己的选择元素，它会动态改变为 ul。

我也在使用 fontawesome 图标 css 框架，我的想法是在 select 中放置一个图标，如下所示

<select name="note[type]">
   <option value="1"><i class="fa fa-car"></i>Car</option>
</select>

但另一方面，如果我写：&#xf07e; 而不是<i> 标签，它不会显示图标，它会正确显示（注意这不是汽车图标的实际代码）。

所以我的问题是：我从数据库中动态填充图标，有没有办法从fa-car 等图标类中通过 php/javascript 获取 unicode 字符？

感谢和问候

【问题讨论】：

这是一个相关的帖子：stackoverflow.com/questions/31549631/…。它建议使用 window.getComputedStyle 函数

标签： javascript php unicode font-awesome materialize

【解决方案1】：

我已经以自己的方式解决了这个问题，这里是那些可能遇到我问题的人的答案：

首先在 StackOverflow 上，我发现了如何使用此函数将 css 转换为数组：

private function BreakCSS($css)
{

    $results = array();

    preg_match_all('/(.+?)\s?\{\s?(.+?)\s?\}/', $css, $matches);
    foreach($matches[0] AS $i=>$original)
        foreach(explode(';', $matches[2][$i]) AS $attr)
            if (strlen(trim($attr)) > 0) // for missing semicolon on last element, which is legal
            {
                list($name, $value) = explode(':', $attr);
                $results[$matches[1][$i]][trim($name)] = trim($value);
            }
    return $results;
}

我使用 file_get_contents 加载了所有的 fontawesome 代码并将其传递给 BreakCss。

如下：

public function GetIcon($icon)
{
    $icon = $icon.":before";
    $fa = file_get_contents(A_CSS.DIRECTORY_SEPARATOR."font-awesome.min.css");
    $arr = $this->BreakCSS($fa);
    $char = "";
    foreach($arr as $selector=>$style)
    {
        if (strpos($selector, $icon))
        {
            $char = str_replace("\\", "&#x", str_replace("\"", "", $style['content'])).";";
        }
    }
    return $char;
}

使用GetIcon("fa-car");

希望这会有所帮助！

【讨论】：