HTML DOM

DOM 例

DOMでは、HTML文書のすべてはノードです。

DOMに従えば、HTML文書のすべてはノードです。

DOM風に言えば:

以下のHTML文書を見てください:

<html>
  <head>
    <title>DOM Tutorial</title>
  </head>
  <body>
    <h1>DOM Lesson one</h1>
    <p>Hello world!</p>
  </body>
</html>

上記HTMLのルートノードは、<html> です。文書内の他の全ノードは、 <html> 内に含まれます。

<html>ノードは、<head>と<body>の2つの子ノードを持っています。

<head>ノードは、<title> ノードを持っています。<body>ノードは、<h1>と<p> ノードを持っています。

DOM処理における共通した誤りは、テキストが要素ノードに含まれると考えていることです。

しかし、要素ノードのテキストはテキストノードに格納されています。

この例:<title>DOM Tutorial</title>では、要素ノード <title>は、"DOM Tutorial" という値を持つテキストノードを持っています。

"DOM Tutorial" は、<title> 要素の値では ありません!

HTML DOMでは、テキストノードの値を innerHTML プロパティによりアクセスすることができます。

後章で、innerHTMLプロパティに関し、更に学習します