如何檢測無法加載谷歌網頁字體的字體

Question

我正在加載谷歌網頁字體以顯示一些文本字符串。

我想要做的是，如果Google Web字體無法加載（可能超時或網絡問題等），如果無論如何，我想顯示一個圖像，而不是下降到字體系列堆棧。

那麼有沒有辦法來檢測Google網頁字體是否已成功加載;以便我可以實現類似於

if (Google webfont loads successfully) { 
    //display the string using that font 
} else { 
    //display an image instead 
} 

Answer 1

webfont加載請求將在您的頁面的HTML節點上生成類屬性。使用Google Webfont Loader（這我假設谷歌類型的服務使用，與Typekit一起），以下類將指示狀態：

1. WF-無效（一個你正在尋找）
2. wf-裝載
3. WF-活躍

此外，您將有特定的字體類，如WF-myfont活性。