确定是否已经加载了谷歌网页字体

Determine if a Google web font has been already loaded

本文关键字：谷歌 网页 字体 加载 是否      更新时间：2023-09-26

我正在构建一个网站，让用户可以选择适用于其文本的字体。我用的是谷歌的网页字体。目前，当他们通过下拉选择字体时，我使用:

 $("head").append("<link href='https://fonts.googleapis.com/css?family=" + FontName + "' rel='stylesheet' type='text/css'>");

这个效果很好。我的问题是:

  • 如果用户多次选择相同的字体(在同一会话中)这个字体加载了两次吗?
  • 如果有，有没有办法确定字体X是否已经装好了，这样就不用装了?

有相当多的，我不认为我想要预加载他们全部，只是当选择。

用户的浏览器应该缓存字体，而不需要你做任何额外的操作。

由于字体位于google的服务器，缓存协商发生在google和您的用户之间。换句话说，你甚至无法控制它。

所以，第二次添加相同的内容，应该不会导致用户浏览器再次加载它。当然，除非用户在浏览器上禁用了缓存

浏览器应该缓存字体，参见https://developers.google.com/webfonts/faq#Many_Fonts_Per_Page

相关文章：