Node: previousSibling 屬性
Node 介面的只讀 previousSibling 屬性返回指定節點在其父節點的 childNodes 列表中緊鄰其前面的節點,如果指定節點是列表中的第一個節點,則返回 null。
注意: 瀏覽器會在文件中插入文字節點來表示源標記中的空格。因此,透過 Node.firstChild 或 Node.previousSibling 獲取的節點可能指向一個空格文字節點,而不是作者打算獲取的實際元素。
有關更多資訊,請參閱 在 DOM 中處理空格。
您可以使用 previousElementSibling 來獲取前一個元素節點(跳過文字節點和任何其他非元素節點)。
要以相反的方向遍歷子節點列表,請使用 Node.nextSibling。
值
一個表示當前節點的前一個兄弟節點的 Node,如果沒有則為 null。
示例
以下示例演示了 previousSibling 在混合了文字節點和元素的場景下以及沒有文字節點的情況下的工作方式。
第一個示例
在此示例中,我們有一系列直接相鄰的 img 元素,它們之間沒有空格。
html
<img id="b0" /><img id="b1" /><img id="b2" />
js
document.getElementById("b1").previousSibling; // <img id="b0">
document.getElementById("b2").previousSibling.id; // "b1"
第二個示例
在此示例中,img 元素之間存在空格文字節點(換行符)。
html
<img id="b0" />
<img id="b1" />
<img id="b2" />
js
document.getElementById("b1").previousSibling; // #text
document.getElementById("b1").previousSibling.previousSibling; // <img id="b0">
document.getElementById("b2").previousSibling.previousSibling; // <img id="b1">
document.getElementById("b2").previousSibling; // #text
document.getElementById("b2").previousSibling.id; // undefined
規範
| 規範 |
|---|
| DOM # ref-for-dom-node-previoussibling① |
瀏覽器相容性
載入中…