如何检测网页中使用了哪种定义的字体？

假设我的页面中有以下CSS规则：

body {
  font-family: Calibri, Trebuchet MS, Helvetica, sans-serif;
}

如何检测用户浏览器中使用了哪种定义的字体？

我检测

的字体包含其他字体不可用的字形，并且当用户没有该字体时，我要显示一个链接，要求用户下载该字体，以便他们可以以正确的字体使用我的Web应用程序。

目前，我正在为所有用户显示下载字体链接，我只想为未安装正确字体的人显示此字体。

我已经看到它以一种不稳定但相当可靠的方式完成了。基本上，将元素设置为使用特定字体，并为该元素设置字符串。如果为元素设置的字体不存在，则采用父元素的字体。因此，他们要做的是测量渲染字符串的宽度。如果它与期望字体（与派生字体相反）相匹配，则存在。这不适用于等宽字体。