JavaScript で DOM 要素で使用される実際のフォント名を取得する方法

JavaScript で計算されたフォントファミリーを取得する

前の質問に対するこのフォローアップでは、取得するためのソリューションを提供することを目的としています。 JavaScript を使用した DOM 要素の実際のフォント名。

汎用の「計算されたスタイル」関数は、フォールバックを含む、要素に対して定義された完全なフォント文字列を返します。ただし、これをドロップダウン フォント ファミリのエントリと照合するには、実際に使用されるフォントの固定フォント名が必要です。

解決策:

計算されたフォント ファミリを取得するにはでは、次のアプローチを検討してください:

<code class="javascript">let para = document.querySelector('p');
let compStyles = window.getComputedStyle(para);
let computedFontFamily = compStyles.getPropertyValue('font-family') // e.g. "Times New Roman"</code>

注:

• このメソッドは、要素に指定されたプライマリ フォント ファミリのみを返します。
• 一部のブラウザ (Chrome や Firefox など) は、CSS フォント インターフェイス モジュール レベル 3 で定義されている「font-family」プロパティをサポートしています。このインターフェイスは、計算されたフォント ファミリーに対してよりきめ細かい制御を提供します。

出典:

https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle

以上がJavaScript で DOM 要素で使用される実際のフォント名を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。