在 JS 执行之前应用 CSS 字体

Apply CSS font before JS execution

我正在构建在 HTML 主体顶部使用 canvas 表面的 Web 应用程序。我使用 canvas 在 SPAN 周围绘制边界。它几乎可以完美运行,但我在页面加载方面仍然存在问题。

我使用了 chrome 调试器并注意到 css 文件中的字体样式在脚本执行后应用,这混淆了 DOM getElementRects 方法并导致 span 边框在执行后错位页面已完全呈现。下面我附上截图。

你知道如何解决这个问题吗?我可以等 css 样式完全应用吗?

Is $(document).ready() also CSS ready?

The ready() method no longer tries to make any guarantees about waiting for all stylesheets to be loaded. Instead all CSS files should be included before the scripts on the page. More Information

确保您的脚本位于 html 页面的底部。

字体加载比 css 加载需要更多的时间 -> How to be notified once a web font has loaded