HTML DOM 要素オブジェクト
HTML DOM ノード
HTML DOM（Document Object Model）では、すべてのものはノードです:
- ドキュメント自体がドキュメントオブジェクトです
- すべてのHTML要素は要素ノードです
- すべてのHTML属性は属性ノードです
- HTML要素に挿入されたテキストはテキストノードです
- コメントはコメントノードです
要素オブジェクト
HTML DOMでは、要素オブジェクトはHTML要素を表します。
要素オブジェクトの子ノードには、要素ノード、テキストノード、コメントノードがあります。
NodeList オブジェクトノードのリストを表し、HTML要素の子ノードの集合に似ています。
要素は属性を持つことができます。属性は属性ノードに属します（次の章を参照してください）。
ブラウザサポート
すべての主要ブラウザは要素オブジェクトとNodeListオブジェクトをサポートしています。
プロパティとメソッド
上記のプロパティとメソッドはすべてのHTML要素に適用できます：
| プロパティ / メソッド | 説明 |
|---|---|
| element.accessKey | 要素のaccesskeyを設定または返します |
| element.addEventListener() | 指定した要素にイベントハンドラを追加します |
| element.appendChild() | 要素に新しい子要素を追加します |
| element.attributes | 要素の属性配列を返します |
| element.childNodes | 要素の子ノードの配列を返します |
| element.children | 要素の子要素のコレクションを返します |
| element.classList | 要素のクラス名をDOMTokenListオブジェクトとして返します。 |
| element.className | 要素のclass属性を設定または返します |
| element.clientTop | 要素の上ボーダーの幅をピクセル単位で表します。 |
| element.clientLeft | 要素の左ボーダーの幅をピクセル単位で表します。 |
| element.clientHeight | ページ上でコンテンツの表示高さを返します（高さにはパディングを含み、ボーダー、マージン、スクロールバーは含みません） |
| element.clientWidth | ページ上でコンテンツの表示幅を返します（幅にはパディングを含み、ボーダー、マージン、スクロールバーは含みません） |
| element.cloneNode() | 要素を複製します |
| element.compareDocumentPosition() | 2つの要素のドキュメント内の位置を比較します。 |
| element.contentEditable | 要素の内容が編集可能かどうかを設定または返します |
| element.dir | 要素内のテキストの方向を設定または返します |
| element.firstElementChild | 要素の最初の子要素を返します |
| element.firstChild | 要素の最初の子ノードを返します |
| element.focus() | ドキュメントまたは要素にフォーカスを設定します |
| element.getAttribute() | 指定した要素の属性値を返します |
| element.getAttributeNode() | 指定した属性ノードを返します |
| element.getElementsByTagName() | 指定したタグ名を持つすべての子要素のコレクションを返します。 |
| element. getElementsByClassName() | ドキュメント内の指定したクラス名を持つすべての要素のコレクションをNodeListオブジェクトとして返します。 |
| element.getFeature() | 指定した機能を実行するAPIオブジェクトを返します。 |
| element.getUserData() | 要素内の関連するキーと値のオブジェクトを返します。 |
| element.hasAttribute() | 要素に指定した属性が存在する場合はtrueを返し、それ以外の場合はfalseを返します。 |
| element.hasAttributes() | 要素に属性が存在する場合はtrueを返し、それ以外の場合はfalseを返します。 |
| element.hasChildNodes() | 要素に子要素があるかどうかを返します |
| element.hasFocus() | ドキュメントまたは要素にフォーカスがあるかどうかを検出してブール値を返します |
| element.id | 要素のidを設定または返します。 |
| element.innerHTML | 要素の内容を設定または返します。 |
| element.insertBefore() | 既存の子要素の前に新しい子要素を挿入します |
| element.isContentEditable | 要素の内容が編集可能な場合はtrueを返し、それ以外の場合はfalseを返します |
| element.isDefaultNamespace() | namespaceURIが指定されている場合はtrueを返し、それ以外の場合はfalseを返します。 |
| element.isEqualNode() | 2つの要素が等しいかどうかを確認します |
| element.isSameNode() | 2つの要素が同じノードを持つかどうかを確認します。 |
| element.isSupported() | 要素が指定した機能をサポートしている場合はtrueを返します。 |
| element.lang | 要素の言語を設定または返します。 |
| element.lastChild | 最後の子ノードを返します |
| element.lastElementChild | 指定した要素の最後の子要素を返します |
| element.matches() | 要素が指定したCSSセレクタに一致する場合、matches()メソッドはtrueを返し、それ以外の場合はfalseを返します。 |
| element.namespaceURI | 名前空間のURIを返します。 |
| element.nextSibling | その要素の直後のノードを返します |
| element.nextElementSibling | 指定した要素の次の兄弟要素（同じノードツリー階層内の次の要素ノード）を返します。 |
| element.nodeName | 要素のタグ名（大文字）を返します |
| element.nodeType | 要素のノードタイプを返します |
| element.nodeValue | 要素のノード値を返します |
| element.normalize() | これを「normal」形式にします。この形式では、構造（要素、コメント、処理命令、CDATAセクション、実体参照など）のみがTextノードを区切り、つまり要素（属性を含む）の下にあるすべてのテキストノードが、隣接するテキストノードも空のテキストノードも持たない状態になります。 |
| element.offsetHeight | 要素の高さを返します。ボーダーとパディングを含みますが、マージンは含みません。 |
| element.offsetWidth | 要素の幅を返します。ボーダーとパディングを含みますが、マージンは含みません。 |
| element.offsetLeft | 現在の要素の相対的な水平オフセット位置を持つオフセットコンテナを返します |
| element.offsetParent | 要素のオフセットコンテナを返します |
| element.offsetTop | 現在の要素の相対的な垂直オフセット位置を持つオフセットコンテナを返します |
| element.ownerDocument | 要素のルート要素（ドキュメントオブジェクト）を返します |
| element.parentNode | 要素の親ノードを返します |
| element.previousSibling | ある要素の直前にある要素を返します |
| element.previousElementSibling | 指定した要素の前の兄弟要素（同じノードツリー階層内の前の要素ノード）を返します。 |
| element.querySelector() | 指定したCSSセレクタに一致する要素の最初の子要素を返します |
| document.querySelectorAll() | 指定したCSSセレクタに一致する要素のすべての子要素ノードのリストを返します |
| element.removeAttribute() | 要素から指定した属性を削除します |
| element.removeAttributeNode() | 指定した属性ノードを削除し、削除後のノードを返します。 |
| element.removeChild() | 子要素を削除します |
| element.removeEventListener() | addEventListener() メソッドで追加されたイベントハンドラを削除します |
| element.replaceChild() | 子要素を置き換えます |
| element.scrollHeight | 要素全体の高さを返します（スクロールバーのある隠れた部分を含む） |
| element.scrollLeft | 現在のビュー内の実際の要素の左端と左端の間の距離を返します |
| element.scrollTop | 現在のビュー内の実際の要素の上端と上端の間の距離を返します |
| element.scrollWidth | 要素全体の幅を返します（スクロールバーのある隠れた部分を含む） |
| element.setAttribute() | 指定した属性を設定または変更し、値を指定します。 |
| element.setAttributeNode() | 指定した属性ノードを設定または変更します。 |
| element.setIdAttribute() | |
| element.setIdAttributeNode() | |
| element.setUserData() | 要素内で指定したキーと値に関連するオブジェクトを設定します。 |
| element.style | 要素のスタイルプロパティを設定または返します |
| element.tabIndex | 要素のタブ順序を設定または返します。 |
| element.tagName | 要素のタグ名を文字列として返します（大文字） |
| element.textContent | ノードとそのテキストコンテンツを設定または返します |
| element.title | 要素のtitle属性を設定または返します |
| element.toString() | 要素を文字列に変換します |
| nodelist.item() | ドキュメントツリーに基づく要素のインデックスを返します |
| nodelist.length | ノードリストのノード数を返します。 |