1. 2.6 共通DOMインターフェイス
      1. 2.6.1 IDL属性におけるコンテンツ属性の反映
      2. 2.6.2 Using reflect in specifications
      3. 2.6.3 コレクション
        1. 2.6.3.1 HTMLAllCollectionインターフェイス
          1. 2.6.3.1.1 [[Call]] ( thisArgument, argumentsList )
        2. 2.6.3.2 HTMLFormControlsCollectionインターフェイス
        3. 2.6.3.3 HTMLOptionsCollectionインターフェイス
      4. 2.6.4 DOMStringListインターフェイス

2.6 共通DOMインターフェイス

2.6.1 IDL属性におけるコンテンツ属性の反映

The building blocks for reflecting are as follows:

A reflected IDL attribute can be defined to reflect a reflected content attribute name of a reflected target. In general this means that the IDL attribute getter returns the current value of the content attribute, and the setter changes the value of the content attribute to the given value.

If the reflected target is an element, then the reflected IDL attribute can additionally declare to support ElementInternals. This means that the ElementInternals interface also has a reflected IDL attribute, with the same identifier, and that reflected IDL attribute reflects the same reflected content attribute name.

The fooBar IDL attribute must reflect the foobar content attribute and support ElementInternals.

Reflected targets have these associated algorithms:

For a reflected target that is an element element, these are defined as follows:

get the element
  1. Return element.

get the content attribute
  1. Let attribute be the result of running get an attribute by namespace and local name given null, the reflected content attribute name, and element.

  2. If attribute is null, then return null.

  3. Return attribute's value.

set the content attribute with a string value
  1. Set an attribute value given element, the reflected content attribute name, and value.

delete the content attribute
  1. Remove an attribute by namespace and local name given null, the reflected content attribute name, and element.

For a reflected target that is an ElementInternals object elementInternals, they are defined as follows:

get the element
  1. Return elementInternals's target element.

get the content attribute
  1. If elementInternals's target element's internal content attribute map[the reflected content attribute name] does not exist, then return null.

  2. Return elementInternals's target element's internal content attribute map[the reflected content attribute name].

set the content attribute with a string value
  1. Set elementInternals's target element's internal content attribute map[the reflected content attribute name] to value.

delete the content attribute
  1. Remove elementInternals's target element's internal content attribute map[the reflected content attribute name].

This results in somewhat redundant data structures for ElementInternals objects as their target element's internal content attribute map cannot be directly manipulated and as such reflection is only happening in a single direction. This approach was nevertheless chosen to make it less error-prone to define IDL attributes that are shared between reflected targets and benefit from common API semantics.


IDL attributes of type DOMString or DOMString? that reflect enumerated content attributes can be limited to only known values. Per the processing models below, those will cause the getters for such IDL attributes to only return keywords for those enumerated attributes, or the empty string or null.

If a reflected IDL attribute has the type DOMString:

If a reflected IDL attribute has the type DOMString?:

If a reflected IDL attribute has the type USVString:

If a reflected IDL attribute has the type boolean:

This corresponds to the rules for boolean content attributes.

If a reflected IDL attribute has the type long, optionally limited to only non-negative numbers and optionally with a default value defaultValue:

If a reflected IDL attribute has the type unsigned long, optionally limited to only positive numbers, limited to only positive numbers with fallback, or clamped to the range [clampedMin, clampedMax], and optionally with a default value defaultValue:

If a reflected IDL attribute has the type double, optionally limited to only positive numbers and optionally with a default value defaultValue:

The values Infinity and Not-a-Number (NaN) values throw an exception on setting, as defined in Web IDL. [WEBIDL]

If a reflected IDL attribute has the type DOMTokenList, then its getter steps are to return a DOMTokenList object whose associated element is this and associated attribute's local name is the reflected content attribute name. Specification authors cannot use support ElementInternals for IDL attributes of this type.

If a reflected IDL attribute has the type T?, where T is either Element or an interface that inherits from Element, then with attr being the reflected content attribute name:

Reflected IDL attributes of this type are strongly encouraged to have their identifier end in "Element" for consistency.

If a reflected IDL attribute has the type FrozenArray<T>?, where T is either Element or an interface that inherits from Element, then with attr being the reflected content attribute name:

Reflected IDL attributes of this type are strongly encouraged to have their identifier end in "Elements" for consistency.

2.6.2 Using reflect in specifications

Reflection is primarily about improving web developer ergonomics by giving them typed access to content attributes through reflected IDL attributes. The ultimate source of truth, which the web platform builds upon, is the content attributes themselves. That is, specification authors must not use the reflected IDL attribute getter or setter steps, but instead must use the content attribute presence and value. (Or an abstraction on top, such as the state of an enumerated attribute.)

Two important exceptions to this are reflected IDL attributes whose type is one of the following:

For those, specification authors must use the reflected target's get the attr-associated element and get the attr-associated elements, respectively. The content attribute presence and value must not be used as they cannot be fully synchronized with the reflected IDL attribute.

A reflected target's explicitly set attr-element, explicitly set attr-elements, cached attr-associated elements, and cached attr-associated elements object are to be treated as internal implementation details and not to be built upon.

2.6.3 コレクション

HTMLFormControlsCollectionおよびHTMLOptionsCollectionインターフェイスは、HTMLCollectionインターフェイスから派生するコレクションである。HTMLAllCollectionインターフェイスはコレクションであるが、派生ではない。

2.6.3.1 HTMLAllCollectionインターフェイス

HTMLAllCollectionインターフェイスは、レガシーdocument.all属性に対して使用される。このインターフェイスは、HTMLCollectionと類似の動作をする。主な違いは、このインターフェイスが完全に最後には何かを返すことになるためにそのメソッドの驚くほどさまざまな異なる(不正)利用を可能にし、プロパティアクセスの代替としての機能として呼び出すことができることということである。

すべてのHTMLAllCollectionオブジェクトは、Documentでルート化され、すべての要素とマッチするフィルターを持つ。その結果HTMLAllCollectionオブジェクトのコレクションによって表される要素は、ルートDocumentのすべての子孫要素から成る。

Objects that implement the HTMLAllCollection interface are legacy platform objects with an additional [[Call]] internal method described in the section below. They also have an [[IsHTMLDDA]] internal slot.

HTMLAllCollectionインターフェイスを実装するオブジェクトには、[[IsHTMLDDA]]内部スロットを持つという事実のために、いくつかの独特な動作を持つ。

これらの特別な振る舞いは、レガシーコンテンツの2つのクラスとの互換性への要望によって動機付けられている:1つはレガシーユーザーエージェントを検出する手段としてdocument.allの存在を利用するものであり、もう1つはそれらのレガシーユーザーエージェントのみをサポートし、その存在を最初にテストすることなくdocument.allオブジェクトを利用するもののである。[JAVASCRIPT]

[Exposed=Window,
 LegacyUnenumerableNamedProperties]
interface HTMLAllCollection {
  readonly attribute unsigned long length;
  getter Element (unsigned long index);
  getter (HTMLCollection or Element)? namedItem(DOMString name);
  (HTMLCollection or Element)? item(optional DOMString nameOrIndex);

  // Note: HTMLAllCollection objects have a custom [[Call]] internal method and an [[IsHTMLDDA]] internal slot.
};

The object's supported property indices are as defined for HTMLCollection objects.

The supported property names consist of the non-empty values of all the id attributes of all the elements represented by the collection, and the non-empty values of all the name attributes of all the "all"-named elements represented by the collection, in tree order, ignoring later duplicates, with the id of an element preceding its name if it contributes both, they differ from each other, and neither is the duplicate of an earlier entry.

The length getter steps are to return the number of nodes represented by the collection.

The indexed property getter must return the result of getting the "all"-indexed element from this given the passed index.

The namedItem(name) method steps are to return the result of getting the "all"-named element(s) from this given name.

The item(nameOrIndex) method steps are:

  1. If nameOrIndex was not provided, return null.

  2. Return the result of getting the "all"-indexed or named element(s) from this, given nameOrIndex.


The following elements are "all"-named elements: a, button, embed, form, frame, frameset, iframe, img, input, map, meta, object, select, and textarea

To get the "all"-indexed element from an HTMLAllCollection collection given an index index, return the indexth element in collection, or null if there is no such indexth element.

To get the "all"-named element(s) from an HTMLAllCollection collection given a name name, perform the following steps:

  1. If name is the empty string, return null.

  2. Let subCollection be an HTMLCollection object rooted at the same Document as collection, whose filter matches only elements that are either:

  3. If there is exactly one element in subCollection, then return that element.

  4. Otherwise, if subCollection is empty, return null.

  5. Otherwise, return subCollection.

To get the "all"-indexed or named element(s) from an HTMLAllCollection collection given nameOrIndex:

  1. If nameOrIndex, converted to a JavaScript String value, is an array index property name, return the result of getting the "all"-indexed element from collection given the number represented by nameOrIndex.

  2. Return the result of getting the "all"-named element(s) from collection given nameOrIndex.

2.6.3.1.1 [[Call]] ( thisArgument, argumentsList )
  1. If argumentsList's size is zero, or if argumentsList[0] is undefined, return null.

  2. Let nameOrIndex be the result of converting argumentsList[0] to a DOMString.

  3. Let result be the result of getting the "all"-indexed or named element(s) from this HTMLAllCollection given nameOrIndex.

  4. Return the result of converting result to an ECMAScript value.

The thisArgument is ignored, and thus code such as Function.prototype.call.call(document.all, null, "x") will still search for elements. (document.all.call does not exist, since document.all does not inherit from Function.prototype.)

2.6.3.2 HTMLFormControlsCollectionインターフェイス

HTMLFormControlsCollectionインターフェイスは、form要素で記載要素コレクションに使用される。

HTMLFormControlsCollection

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet ExplorerNo
Firefox Android?Safari iOS1+Chrome Android?WebView Android?Samsung Internet?Opera Android12.1+

RadioNodeList

Support in all current engines.

Firefox33+Safari7+Chrome21+
Opera?Edge79+
Edge (Legacy)12+Internet Explorer9+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
[Exposed=Window]
interface HTMLFormControlsCollection : HTMLCollection {
  // inherits length and item()
  getter (RadioNodeList or Element)? namedItem(DOMString name); // shadows inherited namedItem()
};

[Exposed=Window]
interface RadioNodeList : NodeList {
  attribute DOMString value;
};
collection.length

Returns the number of elements in collection.

element = collection.item(index)
element = collection[index]

Returns the item at index index in collection. アイテムはツリー順にソートされる。

element = collection.namedItem(name)

HTMLFormControlsCollection/namedItem

Support in all current engines.

Firefox33+Safari4+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet ExplorerNo
Firefox Android?Safari iOS1+Chrome Android?WebView Android?Samsung Internet?Opera Android12.1+
radioNodeList = collection.namedItem(name)
element = collection[name]
radioNodeList = collection[name]

Returns the item with ID or name name from collection.

複数のマッチするアイテムが存在する場合、それらの要素すべてを含むRadioNodeListオブジェクトが返される。

radioNodeList.value

Returns the value of the first checked radio button represented by radioNodeList.

radioNodeList.value = value

Checks the first radio button represented by radioNodeList that has value value.

The object's supported property indices are as defined for HTMLCollection objects.

The supported property names consist of the non-empty values of all the id and name attributes of all the elements represented by the collection, in tree order, ignoring later duplicates, with the id of an element preceding its name if it contributes both, they differ from each other, and neither is the duplicate of an earlier entry.

The namedItem(name) method must act according to the following algorithm:

  1. If name is the empty string, return null and stop the algorithm.
  2. If, at the time the method is called, there is exactly one node in the collection that has either an id attribute or a name attribute equal to name, then return that node and stop the algorithm.
  3. Otherwise, if there are no nodes in the collection that have either an id attribute or a name attribute equal to name, then return null and stop the algorithm.
  4. Otherwise, create a new RadioNodeList object representing a live view of the HTMLFormControlsCollection object, further filtered so that the only nodes in the RadioNodeList object are those that have either an id attribute or a name attribute equal to name. The nodes in the RadioNodeList object must be sorted in tree order.
  5. Return that RadioNodeList object.

Members of the RadioNodeList interface inherited from the NodeList interface must behave as they would on a NodeList object.

RadioNodeList/value

Support in all current engines.

Firefox33+Safari7+Chrome21+
Opera?Edge79+
Edge (Legacy)12+Internet Explorer9+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

The value IDL attribute on the RadioNodeList object, on getting, must return the value returned by running the following steps:

  1. Let element be the first element in tree order represented by the RadioNodeList object that is an input element whose type attribute is in the Radio Button state and whose checkedness is true. Otherwise, let it be null.

  2. If element is null, return the empty string.

  3. If element is an element with no value attribute, return the string "on".

  4. Otherwise, return the value of element's value attribute.

On setting, the value IDL attribute must run the following steps:

  1. If the new value is the string "on": let element be the first element in tree order represented by the RadioNodeList object that is an input element whose type attribute is in the Radio Button state and whose value content attribute is either absent, or present and equal to the new value, if any. If no such element exists, then instead let element be null.

    Otherwise: let element be the first element in tree order represented by the RadioNodeList object that is an input element whose type attribute is in the Radio Button state and whose value content attribute is present and equal to the new value, if any. If no such element exists, then instead let element be null.

  2. If element is not null, then set its checkedness to true.

2.6.3.3 HTMLOptionsCollectionインターフェイス

HTMLOptionsCollection

Support in all current engines.

Firefox1+Safari3+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer6+
Firefox Android?Safari iOS1+Chrome Android?WebView Android37+Samsung Internet?Opera Android12.1+

HTMLOptionsCollectionインターフェイスは、option要素のコレクションに使用される。常にselect要素がルートであり、要素の子孫をコントロールする属性およびメソッドを持つ。

[Exposed=Window]
interface HTMLOptionsCollection : HTMLCollection {
  // inherits item(), namedItem()
  [CEReactions] attribute unsigned long length; // shadows inherited length
  [CEReactions] setter undefined (unsigned long index, HTMLOptionElement? option);
  [CEReactions] undefined add((HTMLOptionElement or HTMLOptGroupElement) element, optional (HTMLElement or long)? before = null);
  [CEReactions] undefined remove(long index);
  attribute long selectedIndex;
};
collection.length

Returns the number of elements in collection.

collection.length = value

When set to a smaller number than the existing length, truncates the number of option elements in the container corresponding to collection.

When set to a greater number than the existing length, if that number is less than or equal to 100000, adds new blank option elements to the container corresponding to collection.

element = collection.item(index)
element = collection[index]

Returns the item at index index in collection. アイテムはツリー順にソートされる。

collection[index] = element

When index is a greater number than the number of items in collection, adds new blank option elements in the corresponding container.

When set to null, removes the item at index index from collection.

When set to an option element, adds or replaces it at index index in collection.

element = collection.namedItem(name)
element = collection[name]

Returns the item with ID or name name from collection.

複数のマッチするアイテムが存在する場合、最初のものが返される。

collection.add(element[, before])

beforeによって与えられるノードの前の要素を挿入する。

The before argument can be a number, in which case element is inserted before the item with that number, or an element from collection, in which case element is inserted before that element.

beforeが省略された、null、または範囲外の数字の場合、elementはリストの最後に加えられるだろう。

Throws a "HierarchyRequestError" DOMException if element is an ancestor of the element into which it is to be inserted.

collection.remove(index)

Removes the item with index index from collection.

collection.selectedIndex

もしあるならば、最初に選ばれたアイテムのインデックスを、または選択したアイテムが存在しない場合−1を返す。

collection.selectedIndex = index

Changes the selection to the option element at index index in collection.

The object's supported property indices are as defined for HTMLCollection objects.

The length getter steps are to return the number of nodes represented by the collection.

The length setter steps are:

  1. Let current be the number of nodes represented by the collection.

  2. If the given value is greater than current, then:

    1. If the given value is greater than 100,000, then return.

    2. Let n be valuecurrent.

    3. Append n new option elements with no attributes and no child nodes to the select element on which this is rooted.

  3. If the given value is less than current, then:

    1. Let n be currentvalue.

    2. Remove the last n nodes in the collection from their parent nodes.

Setting length never removes or adds any optgroup elements, and never adds new children to existing optgroup elements (though it can remove children from them).

The supported property names consist of the non-empty values of all the id and name attributes of all the elements represented by the collection, in tree order, ignoring later duplicates, with the id of an element preceding its name if it contributes both, they differ from each other, and neither is the duplicate of an earlier entry.

When the user agent is to set the value of a new indexed property or set the value of an existing indexed property for a given property index index to a new value value, it must run the following algorithm:

  1. If value is null, invoke the steps for the remove method with index as the argument, and return.

  2. Let length be the number of nodes represented by the collection.

  3. Let n be index minus length.

  4. If n is greater than zero, then append a DocumentFragment consisting of n-1 new option elements with no attributes and no child nodes to the select element on which the HTMLOptionsCollection is rooted.

  5. If n is greater than or equal to zero, append value to the select element. Otherwise, replace the indexth element in the collection by value.

The add(element, before) method must act according to the following algorithm:

  1. If element is an ancestor of the select element on which the HTMLOptionsCollection is rooted, then throw a "HierarchyRequestError" DOMException.

  2. If before is an element, but that element isn't a descendant of the select element on which the HTMLOptionsCollection is rooted, then throw a "NotFoundError" DOMException.

  3. If element and before are the same element, then return.

  4. If before is a node, then let reference be that node. Otherwise, if before is an integer, and there is a beforeth node in the collection, let reference be that node. Otherwise, let reference be null.

  5. If reference is not null, let parent be the parent node of reference. Otherwise, let parent be the select element on which the HTMLOptionsCollection is rooted.

  6. Pre-insert element into parent node before reference.

The remove(index) method must act according to the following algorithm:

  1. If the number of nodes represented by the collection is zero, return.

  2. If index is not a number greater than or equal to 0 and less than the number of nodes represented by the collection, return.

  3. Let element be the indexth element in the collection.

  4. Remove element from its parent node.

The selectedIndex IDL attribute must act like the identically named attribute on the select element on which the HTMLOptionsCollection is rooted

2.6.4 DOMStringListインターフェイス

DOMStringList

Support in all current engines.

Firefox1+Safari5.1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer10+
Firefox Android?Safari iOS?Chrome Android?WebView Android3+Samsung Internet?Opera Android12.1+

DOMStringListインターフェイスは、文字列のリストを表現する非流行のレトロな方法である。

[Exposed=(Window,Worker)]
interface DOMStringList {
  readonly attribute unsigned long length;
  getter DOMString? item(unsigned long index);
  boolean contains(DOMString string);
};

新しいAPIは、DOMStringListよりもむしろsequence<DOMString>または同等のものを使用しなければならない。

strings.length

strings内の文字列の数を返す。

strings[index]
strings.item(index)

stringsからインデックスindexをもつ文字列を返す。

strings.contains(string)

stringsstringが含まれる場合はtrueを返し、そうでなければfalseを返す。

Each DOMStringList object has an associated list.

The DOMStringList interface supports indexed properties. The supported property indices are the indices of this's associated list.

DOMStringList/length

Support in all current engines.

Firefox1+Safari5.1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer10+
Firefox Android?Safari iOS?Chrome Android?WebView Android37+Samsung Internet?Opera Android12.1+

The length getter steps are to return this's associated list's size.

DOMStringList/item

Support in all current engines.

Firefox1+Safari5.1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer10+
Firefox Android?Safari iOS?Chrome Android?WebView Android3+Samsung Internet?Opera Android12.1+

The item(index) method steps are to return the indexth item in this's associated list, or null if index plus one is greater than this's associated list's size.

DOMStringList/contains

Support in all current engines.

Firefox1.5+Safari5.1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer10+
Firefox Android?Safari iOS?Chrome Android?WebView Android3+Samsung Internet?Opera Android12.1+

The contains(string) method steps are to return true if this's associated list contains string, and false otherwise.