JavaScript-節點之間的關係
阿新 • • 發佈:2018-12-20
節點樹中的節點彼此擁有層級關係。
我們常用父(parent)、子(child)和同胞(sibling)等術語來描述這些關係。父節點擁有子節點。同級的子節點被稱為同胞(兄弟或姐妹)。
- 在節點樹中,頂端節點被稱為根(root)。
- 每個節點都有父節點、除了根(它沒有父節點)。
- 一個節點可擁有任意數量的子節點。
- 同胞是擁有相同父節點的節點。
<html> <head> <meta charset="utf-8"> <title>DOM 教程</title> </head> <body> <h1>DOM 課程1</h1> <p>Hello world!</p> </body> </html>
從上面的 HTML 中:
- <html> 節點沒有父節點;它是根節點
- <head> 和 <body> 的父節點是 <html> 節點
- 文字節點 "Hello world!" 的父節點是 <p> 節點
並且:
- <html> 節點擁有兩個子節點:<head> 和 <body>
- <head> 節點擁有兩個子節點:<meta> 與 <title> 節點
- <title> 節點也擁有一個子節點:文字節點 "DOM 教程"
- <h1> 和 <p> 節點是同胞節點,同時也是 <body> 的子節點
並且:
- <head> 元素是 <html> 元素的首個子節點
- <body> 元素是 <html> 元素的最後一個子節點
- <h1> 元素是 <body> 元素的首個子節點
- <p> 元素是 <body> 元素的最後一個子節點