ノードとノード ツリーの概念
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> ノードを祖先ノードとして使用できます。
次のセクション