Document: fonts プロパティ

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年1月以降、すべてのブラウザーで利用可能です。

もっと詳しく
完全な互換性情報を見る

fonts は Document インターフェイスのプロパティで、文書の FontFaceSet インターフェイスを返します。

この機能は CSS フォント読み込み API の一部です。

値

返値は文書の FontFaceSet インターフェイスです。 FontFaceSet インターフェイスは新しいフォントを読み込んだり、以前読み込まれたフォントの状態をチェックしたりするのに有用です。

例

すべてのフォントが読み込まれた後の操作の実行

document.fonts.ready.then((fontFaceSet) => {
 // 使用するフォントをすべて読み込んだ後にのみ行う必要のある処理は、
 // ここで行います。
 const fontFaces = [...fontFaceSet];
 console.log(fontFaces);
 // サイトで使用していないフォントがアンロードされることがあります。
 console.log(fontFaces.map((f) => f.status));
});

このプロミスは、使用するすべてのフォントの読み込みとレイアウト処理が完了したときに履行されます。使用するフォントの集合は、宣言されたフォントの集合とは異なっても構いません。例えば、オプションのフォント(すなわち font-display: optional で宣言されたフォント)が時間内に読み込めなかった場合などです。