DOM

インターフェイス

ElementInternals インターフェイス

→● MS（en-US）

Document_Object_Model の ElementInternals インターフェイスは、カスタム要素が HTML フォームに完全に参加できるようにする方法を Web 開発者に提供します。これは、標準の HTML フォーム要素を操作するのと同じ方法でこれらの要素を操作するためのユーティリティを提供し、アクセシビリティ オブジェクト モデルを要素に公開します。

コンストラクター

このインターフェースにはコンストラクターがありません。HTMLElement.attachInternals() を呼び出すと、ElementInternals オブジェクトが返されます。

プロパティ

ElementInternals.shadowRoot 読取専用 ●

この要素に関連付けられている ShadowRoot オブジェクトを返します。

ElementInternals.form 読取専用 ●

この要素に関連付けられている HTMLFormElement を返します。

ElementInternals.states 読取専用

この要素に関連付けられた CustomStateSet を返します。

ElementInternals.willValidate 読取専用 ●

要素が制約検証の候補である送信可能な要素である場合に true を返す boolean 値。

ElementInternals.validity 読取専用 ●

要素が存在できるさまざまな有効性状態を表す ValidityState オブジェクトを返します。制約の検証に関して。

ElementInternals.validationMessage 読取専用 ●

この要素の検証メッセージを含む文字列。

ElementInternals.labels 読取専用 ●

この要素に関連付けられているすべてのラベル要素の NodeList を返します。

ARIAから含まれるプロパティ

ElementInternals インターフェイスには、次のプロパティが含まれています。ARIAMixinミックスインで定義されています。

注： これらは、デフォルトのアクセシビリティ セマンティクスをカスタム要素で定義できるようにするために含まれています。これらは作成者が定義した属性によって上書きされる可能性がありますが、作成者がこれらの属性を削除した場合でもデフォルトのセマンティクスが保持されるようにしてください。または、それらをまったく追加しないでください。詳細については、アクセシビリティ オブジェクト モデルの説明を参照してください。

ElementInternals.ariaAtomic

aria-relevant 属性によって定義された変更通知に基づいて、支援技術が変更された領域のすべてを表示するか、一部のみを表示するかを示す、aria-atomic 属性を反映する DOMString です。

ElementInternals.ariaAutoComplete

aria-autocomplete 属性を反映する DOMString であり、テキストを入力すると、コンボボックスに対するユーザーの意図した値の 1 つ以上の予測の表示がトリガーされるかどうかを示します。検索ボックス、またはテキストボックスを使用して、予測が行われた場合に予測がどのように表示されるかを指定します。

ElementInternals.ariaBusy

要素が変更されているかどうかを示す aria-busy 属性を反映するDOMStringであり、支援技術は、変更が完了するまで待ってからユーザーに公開する場合があるためです。

ElementInternals.ariaChecked

aria-checked 属性を反映する DOMString であり、これは、チェックボックスの現在の「checked《状態を示します。ラジオボタン、および状態がチェックされている他のウィジェット。

ElementInternals.ariaColCount

aria-colcount 属性を反映する DOMString であり、これは、テーブル、グリッド、またはツリーグリッドの列数を定義します。

ElementInternals.ariaColIndex

aria-colindex 属性を反映する DOMString であり、これは、テーブル、グリッド、またはツリーグリッド内の列の総数に対する要素の列インデックスまたは位置を定義します。

ElementInternals.ariaColIndexText

aria-colindextext 属性を反映する DOMString であり、aria-colindex の人間が読める形式のテキストの代替を定義します。

ElementInternals.ariaColSpan

aria-colspan属性を反映するDOMStringであり、これは、テーブル、グリッド、またはツリーグリッド内のセルまたはグリッドセルがまたがる列の数を定義します。

ElementInternals.ariaCurrent

aria-current 属性を反映する DOMString であり、コンテナまたは関連要素のセット内の現在のアイテムを表す要素を示します。

ElementInternals.ariaDescription

aria-description 属性を反映する DOMString であり、これは、現在の ElementInternals を記述または注釈する文字列値を定義します。

ElementInternals.ariaDisabled

aria-disabled 属性を反映する DOMString であり、これは、要素が認識可能であるが無効になっていることを示します。したがって、編集したり、その他の方法で操作したりすることはできません。

ElementInternals.ariaExpanded

aria-expanded 属性を反映する DOMString であり、この要素によって所有または制御されるグループ化要素が展開されているか折りたたまれているかを示します。

ElementInternals.ariaHasPopup

aria-haspopup 属性を反映する DOMString であり、これは、インタラクティブ ポップアップ要素の可用性とタイプを示します。メニューやダイアログなど、ElementInternals によってトリガーできます。

ElementInternals.ariaHidden

aria-hidden 属性を反映する DOMString であり、これは、要素がアクセシビリティ API に公開されているかどうかを示します。

ElementInternals.ariaKeyShortcuts

aria-keyshortcuts 属性を反映する DOMString であり、これは、作成者が ElementInternals をアクティブ化またはフォーカスするために実装したキーボード ショートカットを示します。

ElementInternals.ariaLabel

aria-label 属性を反映する DOMString であり、これは、現在の ElementInternals にラベルを付ける文字列値を定義します。

ElementInternals.ariaLevel

aria-level 属性を反映する DOMString であり、これは、構造内の要素の階層レベルを定義します。

ElementInternals.ariaLive

aria-live 属性を反映する DOMString であり、これは、要素が更新されることを示し、また、ユーザーエージェントの更新の種類について説明します。支援技術、そしてユーザーはライブリージョンから期待することができます。

ElementInternals.ariaModal

aria-modal 属性を反映する DOMString であり、これは、表示時に要素がモーダルであるかどうかを示します。

ElementInternals.ariaMultiline

aria-multiline 属性を反映する DOMString であり、これは、テキストボックスが複数行の入力を受け入れるか、1 行のみを受け入れるかを示します。

ElementInternals.ariaMultiSelectable

aria-multiselectable 属性を反映する DOMString であり、これは、ユーザーが現在選択可能な子孫から複数のアイテムを選択できることを示します。

ElementInternals.ariaOrientation

aria-orientation 属性を反映する DOMString であり、これは、要素の方向が水平、垂直、または上明／あいまい であるかどうかを示します。

ElementInternals.ariaPlaceholder

aria-placeholder 属性を反映する DOMString であり、これは、コントロールに値がない場合にユーザーがデータを入力できるようにするための短いヒントを定義します。

ElementInternals.ariaPosInSet

aria-posinset 属性を反映する DOMString であり、これは、listitems または treeitems の現在のセット内の要素の番号または位置を定義します。

ElementInternals.ariaPressed

aria-pressed 属性を反映する DOMString であり、これは、トグルボタンの現在の「pressed《状態を示します。

ElementInternals.aria 読取専用

aria-readonly 属性を反映する DOMString であり、これは、要素が編集できないことを示します。ただし、それ以外の場合は操作可能です。

ElementInternals.ariaRelevant

aria-relevant 属性を反映する DOMString であり、これは、ライブリージョン内のアクセシビリティ ツリーが変更されたときにユーザーエージェントがトリガーする通知を示します。これは、アリアが生きている地域のどのような変化が関連していて、発表されるべきかを説明するために使用されます。

ElementInternals.ariaRequired

aria-required 属性を反映する DOMString であり、これは、フォームを送信する前に要素にユーザー入力が必要であることを示します。

ElementInternals.ariaRoleDescription

aria-roledescription 属性を反映する DOMString であり、人間が読める形式を定義し、要素の役割についての作成者ローカライズされた説明。

ElementInternals.ariaRowCount

aria-rowcount 属性を反映する DOMString であり、これは、テーブル、グリッド、またはツリーグリッドの行の総数を定義します。

ElementInternals.ariaRowIndex

aria-rowindex 属性を反映する DOMString であり、これは、テーブル、グリッド、またはツリーグリッド内の行の総数に対する要素の行インデックスまたは位置を定義します。

ElementInternals.ariaRowIndexText

aria-rowindextext 属性を反映する DOMString であり、これは、aria-rowindex の人間が読めるテキストの代替を定義します。

ElementInternals.ariaRowSpan

aria-rowspan 属性を反映する DOMString であり、これは、テーブル、グリッド、またはツリーグリッド内のセルまたはグリッドセルがまたがる行数を定義します。

ElementInternals.ariaSelected

aria-selected 属性を反映する DOMString であり、これは、選択された状態を持つ要素の現在の「選択された《状態を示します。

ElementInternals.ariaSetSize

aria-setsize 属性を反映する DOMString であり、これは、listitems または treeitems の現在のセット内のアイテムの数を定義します。

ElementInternals.ariaSort

aria-sort 属性を反映する DOMString であり、これは、テーブルまたはグリッド内のアイテムが昇順または降順のどちらでソートされているかを示します。

ElementInternals.ariaValueMax

aria-valueMax 属性を反映する DOMString であり、これは、範囲ウィジェットの最大許容値を定義します。

ElementInternals.ariaValueMin

aria-valueMin 属性を反映する DOMString であり、これは、範囲ウィジェットの最小許容値を定義します。

ElementInternals.ariaValueNow

aria-valueNow 属性を反映する DOMString であり、範囲ウィジェットの現在の値を定義します。

ElementInternals.ariaValueText

aria-valuetext 属性を反映する DOMString であり、これは、範囲ウィジェットの aria-valuenow の人間が読めるテキストの代替を定義します。

メソッド

ElementInternals.setFormValue() ●

要素の送信値と状態を設定し、これらをユーザーエージェントに伝達します。

ElementInternals.setValidity() ●

要素の有効性を設定します。

ElementInternals.checkValidity() ●

要素が、適用されている制約検証ルールを満たしているかどうかを確認します。

ElementInternals.reportValidity() ●

要素が適用されている制約検証ルールを満たしているかどうかを確認し、検証メッセージをユーザーエージェントに送信します。

例

class CustomCheckbox extends HTMLElement {

  static formAssociated = true;



  constructor() {

    super();

    this.internals_ = this.attachInternals();

  }



  /* ... */

}



window.customElements.define('custom-checkbox', CustomCheckbox);



let element = document.createElement('custom-checkbox');

let form = document.createElement('form');



// Append element to form to associate it

form.appendChild(element);



console.log(element.internals_.form);

// expected output: <form><custom-checkbox></custom-checkbox></form>

element . attachInternals()→●

カスタム要素 element をターゲットにしている ElementInternals オブジェクトを返す。次のいずれかに該当する場合、例外を投出する：

element はカスタム要素でない／
要素定義を成す一部として "internals" 特能は上能化されている／
同じ要素上で重ねて call されたとき

アクセス能意味論

internals . role [ = value ]→●

internals のターゲット要素用の既定の ARIA role を［設定する／検索取得する］ ― それは、ページ作者が role 属性を利用して上書きしない限り、利用されることになる。

テスト