节点：previousSibling 属性

只读的 previousSibling 属性是 Node 接口的属性，它返回在指定节点的父节点的 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①

浏览器兼容性

BCD 表仅在浏览器中加载

另请参阅