files/fr/web/api/node/previoussibling/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

---
title: element.previousSibling
slug: Web/API/Node/previousSibling
tags:
  - API
  - DOM
  - Noeuds
  - Propriétés
translation_of: Web/API/Node/previousSibling
---
<p>{{APIRef("DOM")}}</p>

<p>La propriété en lecture seule  <code><strong>Node.previousSibling</strong></code> renvoie le nœud (<code>node</code>) précédant immédiatement le nœud courant dans la liste {{domxref("Node.childNodes", "childNodes")}} de son parent, ou <code>null</code> s'il s'agit du premier nœud de la liste.</p>

<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2>

<pre class="syntaxbox"><var>previousNode</var> = <em>node</em>.previousSibling;
</pre>

<h2 id="Exemple">Exemple</h2>

<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="comment token">// &lt;a&gt;&lt;b1 id="b1"/&gt;&lt;b2 id="b2"/&gt;&lt;/a&gt;</span>

<span class="function token">alert</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"b1"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>previousSibling<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// null</span>
<span class="function token">alert</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"b2"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>previousSibling<span class="punctuation token">.</span>id<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "b1"</span></code></pre>

<h2 id="Notes" name="Notes">Notes</h2>

<p></p><p>Les navigateurs basés sur Gecko insèrent des nœuds texte dans un document pour représenter des espaces
    vides dans le balisage source. Par conséquent, un nœud obtenu par exemple via <a href="/fr/docs/Web/API/Node/firstChild" title="La propriété en lecture seule Node.firstChild renvoie le premier nœud enfant de l'arbre ou null s'il n'en a pas. Si le noeud est un Document , il renvoie le premier noeud de la liste de ses enfants directs."><code>Node.firstChild</code></a> ou
    <a href="/fr/docs/Web/API/Node/previousSibling" title='{{APIRef("DOM")}}'><code>Node.previousSibling</code></a> peut faire référence à un nœud texte contenant des espaces plutôt qu'au véritable élément
    que l'auteur comptait obtenir.</p>

    <p>Consultez <a href="/fr/docs/Gestion_des_espaces_dans_le_DOM">Gestion des espaces dans le DOM</a>
    et <a class="external" href="http://www.w3.org/DOM/faq.html#emptytext" rel="noopener"><i>Why are some Text nodes empty?</i>
    dans la FAQ DOM 3 du W3C</a> pour plus d'informations.</p><p></p>

<p>L'opération inverse <code><a href="https://developer.mozilla.org/fr/docs/Web/API/Node/nextSibling">Node.nextSibling</a></code> permet de rechercher l'élément suivant.</p>

<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h2>

<ul>
 <li><a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">DOM Level 1 Core: previousSibling</a> <small>— <a class="external" href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">traduction</a> (non normative)</small></li>
 <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">DOM Level 2 Core: previousSibling</a> <small>— <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">traduction</a> (non normative)</small></li>
 <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-640FB3C8">DOM Level 3 Core: previousSibling</a></li>
</ul>

<h2 class="noinclude" id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>


<p>{{Compat("api.Node.previousSibling")}}</p>

<h2 class="noinclude" id="Voir_aussi">Voir aussi</h2>

<p>{{domxref("Node.nextSibling")}}</p>