DOM(Document Object Model)

用語

DOM(Document Object Model)

読み方

ディーオーエム

説明

DOM(Document Object Model)は、ブラウザがHTMLやXML文書を解析し、ツリー構造として内部的に表現したものです。
JavaScriptがWEBページを操作するときは、必ずこのDOMを経由して要素を取得・変更します。

DOMのポイント

  • ページ内のすべての要素は「ノード(node)」として扱われる
  • JavaScriptは document.getElementById()querySelector() を使ってDOMにアクセスする
  • 新しい要素の追加・削除、テキスト変更、クラス操作などが可能

使用例(JavaScript)

const title = document.querySelector('h1');
title.textContent = '変更後のタイトル';

こんなときに使う

  • ボタンをクリックしたら表示を切り替えたい
  • スクロールに応じてヘッダーの色を変えたい
  • 動的にリスト要素を追加・削除したい

参考サイト・引用元

タイトルとURLをコピーしました