首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在DOM上加载google字体?

如何在DOM上加载google字体?
EN

Stack Overflow用户
提问于 2018-12-30 22:37:15
回答 2查看 967关注 0票数 1

我想在DOM准备好的情况下,用Ajax加载这个字体<link href="https://fonts.googleapis.com/css?family=KoHo:400" rel="stylesheet">,这可能吗?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-12-30 22:41:32

我不太清楚你在这里想要达到什么目的。如果这是页面速度问题,并且希望异步加载字体,请参见本文:

https://www.lockedownseo.com/load-google-fonts-asynchronously-for-page-speed/

通过<link>标签加载Google字体将确保在页面加载之前呈现字体。

票数 2
EN

Stack Overflow用户

发布于 2018-12-30 22:48:34

出于性能考虑,您希望在DOM上加载字体吗?还是因为您希望在呈现之前准备字体?

如果您正在使用jQuery,那么您可以很好地阅读一下CC-Tricks https://css-tricks.com/preventing-the-performance-hit-from-custom-fonts/中类似的内容。

根据这篇文章所说的,您可以设置一个cookie,让您的脚本知道字体是缓存的。否则,您可以使用ajax加载。

来自第一条:

代码语言:javascript
复制
// Check if a cookie exists suggesting fonts are cached
if (!fonts_are_cached) {
    // Don't slow down rendering
    $(window).load(function() {

        // Load in custom fonts
        $.ajax({
            url: 'https://fonts.googleapis.com/css?family=KoHo:400'
        });

        // Don't actually do anything with them, just request them so they are cached.
        // Set cookie indicating fonts are cached

    });
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53981987

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档