字体首先加载为文本，然后加载图标

Question

我在网站上使用material.io图标。首次打开网站时，图标不会加载并保留为文本。在以后所有的页面加载中，图标都会正确加载。

如何使图标第一次出现？

谢谢。

Answer 1

这种情况是在material.io的CSS正在加载时发生的！ 您可以将svg用于重要的图标，它可以加快加载速度，而另一个图标可以使用material.io

或在文档完全加载后使用jQuery HTML方法显示图标 例如：

<i class="material-icons">&#xE87C;</i>

$( document ).ready(function() {
  $('i.material-icons').html("&#xE87C;");
});

Answer 2

在

内编写您的jquery

$( document ).ready(function() {
   //your code comes here
});

页面上所有必要的操作完成后，将加载$(document).ready();下的代码。

Answer 3

我找到了解决这个问题的办法： 如果我使用以下样式编写i标签：

<i class="material-icons middle comment"></i>

然后，当文档准备就绪时，我填写i标签的内容。我编写以下jQuery代码：

jQuery( document ).ready(function() {
    jQuery('i.person').html("comment");
});