使用FontFaceSet#check()检测字体加载始终返回true，是否用法有误？

你遇到的问题并非API使用错误，而是FontFaceSet#check()的设计逻辑导致的：

核心原因 #

document.fonts.check()的作用是检查是否存在任意可用字体能够匹配你传入的字体规则，而非严格验证某个特定字体是否已加载。当你传入一个不存在的字体名时，浏览器会自动触发字体回退机制，使用系统默认的备用字体（如Arial、宋体等）来匹配，因此该方法会判定存在可用字体，始终返回true。

正确检测方式 #

要严格验证目标字体是否存在，需要构造一个不会触发回退的字体匹配规则：在目标字体后添加一个肯定不存在的字体族（比如随机无意义字符串），确保只有当目标字体存在时，才能找到匹配项。示例代码：

// 替换YourTargetFont为你要检测的字体名
document.fonts.check("1px 'YourTargetFont', 'RandomNonExistentFont_789'");

• 如果目标字体已加载/存在，方法返回true；
• 如果目标字体不存在，浏览器找不到任何可匹配的字体，返回false。

额外优化方案 #

如果需要更精准地处理字体加载状态，可以结合FontFaceSet.load()方法，它会返回Promise，能明确感知字体加载成功或失败：

document.fonts.load("1px 'YourTargetFont'")
  .then(() => console.log("字体已成功加载"))
  .catch(() => console.log("字体不存在或加载失败"));

内容的提问来源于stack exchange，提问作者Yulin He