TextFormat: underlineThickness プロパティ

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

TextFormat インターフェイスの underlineThickness プロパティは、この書式を適用するテキストの範囲につけるべき下線の太さを表します。

String で、以下のいずれかの値です。

  • "none": 下線なし
  • "thin": 細い下線
  • "thick": 太い下線

適用するべき下線の太さを読み取る

以下の例では、textformatupdate イベントの underlineThickness プロパティを用いて、書式を適用するテキストに適用する下線の太さを判別する方法を示します。この例におけるイベントリスナーコールバックは、IME ウィンドウを用いてテキストを変換しているときにしか呼ばれないことに注意してください。

html
<div id="editor" style="height:200px;background:#eee;"></div>
js
const editorEl = document.getElementById("editor");
const editContext = new EditContext(editorEl);
editorEl.editContext = editContext;

editContext.addEventListener("textformatupdate", (e) => {
  const formats = e.getTextFormats();

  for (const format of formats) {
    console.log(
      `IME wants to apply a ${format.underlineThickness} underline between ${format.rangeStart} and ${format.rangeEnd}.`,
    );
  }
});

仕様書

Specification
EditContext API
# dom-textformat-underlinethickness

ブラウザーの互換性

BCD tables only load in the browser

関連情報