Node: previousSibling プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

previousSiblingNode インターフェイスの読み取り専用プロパティで、指定されたノードの親ノードの childNodes リスト内で、直前にある ノードを返します。指定されたノードがリストの先頭にあった倍は null を返します。

メモ: ブラウザーはソースのマークアップにあるホワイトスペースを表すために、文書にテキストノードを挿入します。 そのため、例えば Node.firstChildNode.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"

2 番目の例

この例では、 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

仕様書

Specification
DOM Standard
# ref-for-dom-node-previoussibling①

ブラウザーの互換性

BCD tables only load in the browser

関連情報