Node: previousSibling プロパティ

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

関連情報