ノードとノードツリー
ノードとノード ツリーの概念
HTML タグ、タグ属性、テキスト コンテンツ、コメント、スペース、タブなどを含む、HTML ドキュメント内のすべてのコンテンツはノードです。
HTML ドキュメント内のすべてのノードは、ノード ツリー (またはドキュメント ツリー) を形成します。 HTML ドキュメント内の各要素、属性、テキストなどは、ツリー内のノードを表します。ツリーはドキュメント ノードから始まり、そこからツリーの最下位レベルにあるすべてのテキスト ノードに分岐し続けます。
ノード間の関係
DOM ノード間には、親ノード、子ノード、兄弟ノード (ピア ノード)、子孫、親などを含む階層関係があります。
<html> <head> <title>DOM节点之间的关系</title> </head> <body> <h1>这是标题</h1> <p>这是内容</p> </body> </html>
上記のコードからわかるように:
ドキュメント ノード (ルート ノード) を除くすべてのノードには親ノードがあります。
たとえば、<head> と <body> の親ノードは <html> ノード、「This is content」の親ノードは <p> ノードです。
ほとんどの要素ノードには子ノードがあります。
たとえば、<head> ノードには、<title> ノードがあり、<title> ノードには、「This is the title」という子ノードもあります。
ノードが共通の親ノードを持つ場合、それらは兄弟 (兄弟ノード) になります。
たとえば、<h1> と <p> は兄弟ノードであり、その親ノードは両方とも <body> です。
ノードには、ノードのすべての子ノード、またはこれらの子ノードの子ノードなどを参照する子孫を持つこともできます。
たとえば、すべてのテキスト ノードは <html> ノードの子孫であり、最初のテキスト ノードは <head> ノードの子孫です。
ノードには先祖を持つこともできます。祖先は、ノードの親ノード、または親ノードの親ノードなどです。
たとえば、すべてのテキスト ノードは、<html> ノードを祖先ノードとして使用できます。
![フロントエンドプロジェクト-Shangyou [HTML/CSS/JS技術総合演習]](https://img.php.cn/upload/course/000/000/068/63bfcb2974f91471.jpg)
![Apipost 実用化 [API、インターフェース、自動テスト、モック]](https://img.php.cn/upload/course/000/000/068/63b3c967a20f4861.jpg)
