- Products -


Software


NEWS


Special



- Knowledge -


Category × Tag



- Like -

公開
作成日:2021/11/4
更新日:2021/11/4

【HTML】DOMとHTMLElement・HTML要素とNODEの違いについて解説

・どれも同じものを指していそうな気がする用語達。違いを見ていく。

要約


・HTML上に存在するのは、HTML要素=HTMLタグであると言える。
 実際には、HTMLElementを継承したサブクラスである。

・HTMLElementはNodeを継承している。Nodeは基底クラスである。
 したがって、HTML要素=HTMLElement=Nodeである。

・DOMはページとスクリプトを結合する役割を担っている。
 DOM操作というのは、DOM APIを使ってHTML要素を操作することを指している。
 DOMはより広範囲な意味を持っており、WEBページで使われるDOMはHTML DOMを指している。

DOM


・Document Object Model (DOM) は、— ウェブページを表す HTML のように — 文書の構造をメモリー内に表現することで、ウェブページとスクリプトやプログラミング言語を接続するものです。
 →「DOMとはページとスクリプトを接続するもの=インターフェース」

・DOM は文書を論理的なツリーで表現します。ツリーのそれぞれの枝はノードで終わっており、それぞれのノードがオブジェクトを含んでいます。
 →「ツリーのそれぞれの枝はノードで終わっている」

・ノードにはイベントハンドラーを割り当てることができます。
 →「ノードにイベント設定をしている」

HTML DOM


・HTML を含む文書は、 HTML 仕様で拡張した様々な HTML 固有の機能を含む Document インターフェイスを使用して記述されます。具体的には、 Element インターフェイスは拡張されて HTMLElement を始めとするサブクラスになっており、それぞれが要素の一つ (または深く関係した同類のもの) を表します。
 →「HTMLElementはHTML要素を表すためのサブクラスである」

HTML DOM API によって、タブやウィンドウ、 CSS スタイルやスタイルシート、ブラウザーの履歴など、様々なブラウザーの機能にアクセスすることができます。
 →「JavascriptでDOM APIを使用して色々な機能にアクセスしている」

https://developer.mozilla.org/ja/docs/Web/API/Document_Object_Model#What_is_the_DOM.3F

Node


・DOM の Node インターフェイスは、他の多くの DOM API オブジェクトのベースとなる抽象的な基底クラスです。

・Node の機能を実装しているオブジェクトはすべて、そのサブクラスの一つをベースにしています。最も注目すべきものは、 Document, Element, DocumentFragment です。

https://developer.mozilla.org/ja/docs/Web/API/Node

HTMLElement・HTML要素


・Element は Document の中にあるすべての要素オブジェクト (すなわち、要素を表現するオブジェクト) が継承する、もっとも一般的な基底クラスです。このインターフェイスは、すべての種類の要素に共通するメソッドとプロパティを記述するだけのものです。多くの具体的なクラスが Element を継承します。例えば HTML 要素には HTMLElement インターフェイス、SVG 要素には SVGElement インターフェイスなど。ほとんどの機能は、クラスの階層を下りると具体化していきます。
https://developer.mozilla.org/ja/docs/Web/API/Element

・HTML要素一覧は以下の通り。各タグはHTML要素一覧で列挙される存在である。
https://developer.mozilla.org/ja/docs/Web/HTML/Element


Category



Tag




関連記事


{{tmp.name}}

{{article.category}} {{article.title}}