aboutsummaryrefslogtreecommitdiff
path: root/files/fr/orphaned/web/api/childnode
diff options
context:
space:
mode:
Diffstat (limited to 'files/fr/orphaned/web/api/childnode')
-rw-r--r--files/fr/orphaned/web/api/childnode/replacewith/index.html118
1 files changed, 118 insertions, 0 deletions
diff --git a/files/fr/orphaned/web/api/childnode/replacewith/index.html b/files/fr/orphaned/web/api/childnode/replacewith/index.html
new file mode 100644
index 0000000000..675e7c6026
--- /dev/null
+++ b/files/fr/orphaned/web/api/childnode/replacewith/index.html
@@ -0,0 +1,118 @@
+---
+title: ChildNode.replaceWith()
+slug: orphaned/Web/API/ChildNode/replaceWith
+tags:
+ - API
+ - DOM
+ - Méthodes
+ - Noeuds
+ - Reference
+translation_of: Web/API/ChildNode/replaceWith
+original_slug: Web/API/ChildNode/replaceWith
+---
+<div>{{APIRef("DOM")}}<br>
+La méthode <code><strong>ChildNode</strong></code><strong><code>.replaceWith()</code></strong> remplace ce <code>ChildNode</code> de la liste des enfants de son parent par un ensemble d'objets {{domxref("Node")}} (<em>noeud</em>) ou {{domxref("DOMString")}} (<em>chaîne de caractères</em>).<br>
+Les objets {{domxref("DOMString")}} sont insérés en tant que noeuds {{domxref("Text")}}.</div>
+
+<h2 id="Syntaxe">Syntaxe</h2>
+
+<pre class="syntaxbox">[Throws, Unscopable]
+void ChildNode.replaceWith((Node ou DOMString)... nodes);
+</pre>
+
+<h3 id="Paramètres">Paramètres</h3>
+
+<dl>
+ <dt><code>nodes</code></dt>
+ <dd>Un ensemble d'objets {{domxref("Node")}} (<em>noeud</em>) ou {{domxref("DOMString")}} (<em>chaîne de caractères</em>) à remplacer.</dd>
+</dl>
+
+<h3 id="Exceptions">Exceptions</h3>
+
+<ul>
+ <li>{{domxref("HierarchyRequestError")}} : Le noeud ne peut pas être inséré au point spécifié dans la hiérarchie.</li>
+</ul>
+
+<h2 id="Exemples">Exemples</h2>
+
+<h3 id="Utilisation_de_replaceWith">Utilisation de <code>replaceWith()</code></h3>
+
+<pre class="brush: js">var parent = document.createElement("div");
+var enfant = document.createElement("p");
+parent.appendChild(enfant);
+var span = document.createElement("span");
+
+enfant.replaceWith(span);
+
+console.log(parent.outerHTML);
+// "&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;"
+</pre>
+
+<h3 id="ChildNode.replaceWith_nest_pas_accessible"><code>ChildNode.replaceWith()</code> n'est pas accessible</h3>
+
+<p>La méthode <code>replaceWith()</code> n'est pas comprise dans une instruction with. Voir {{jsxref("Symbol.unscopables")}} pour plus d'informations.</p>
+
+<pre class="brush: js">with(node) {
+ replaceWith("foo");
+}
+// ReferenceError: replaceWith n'est pas défini </pre>
+
+<h2 id="Prothèse_démulation">Prothèse d'émulation</h2>
+
+<p>Vous pouvez utiliser une prothèse d'émulation pour la méthode <code>replaceWith()</code> pour Internet Explorer 10 et plus avec le code suivant :</p>
+
+<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">ReplaceWith</span><span class="punctuation token">(</span>Ele<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+ <span class="string token">'use-strict'</span><span class="punctuation token">;</span> <span class="comment token">// For safari, and IE &gt; 10</span>
+ <span class="keyword token">var</span> parent <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>parentNode<span class="punctuation token">,</span>
+ i <span class="operator token">=</span> arguments<span class="punctuation token">.</span>length<span class="punctuation token">,</span>
+ firstIsNode <span class="operator token">=</span> <span class="operator token">+</span><span class="punctuation token">(</span>parent <span class="operator token">&amp;&amp;</span> <span class="keyword token">typeof</span> Ele <span class="operator token">===</span> <span class="string token">'object'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+ <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>parent<span class="punctuation token">)</span> <span class="keyword token">return</span><span class="punctuation token">;</span>
+
+ <span class="keyword token">while</span> <span class="punctuation token">(</span>i<span class="operator token">--</span> <span class="operator token">&gt;</span> firstIsNode<span class="punctuation token">)</span><span class="punctuation token">{</span>
+ <span class="keyword token">if</span> <span class="punctuation token">(</span>parent <span class="operator token">&amp;&amp;</span> <span class="keyword token">typeof</span> arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span> <span class="operator token">!==</span> <span class="string token">'object'</span><span class="punctuation token">)</span><span class="punctuation token">{</span>
+ arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span> <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createTextNode</span><span class="punctuation token">(</span>arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+ <span class="punctuation token">}</span> <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>parent <span class="operator token">&amp;&amp;</span> arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>parentNode<span class="punctuation token">)</span><span class="punctuation token">{</span>
+ arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>parentNode<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+ <span class="keyword token">continue</span><span class="punctuation token">;</span>
+ <span class="punctuation token">}</span>
+ parent<span class="punctuation token">.</span><span class="function token">insertBefore</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>previousSibling<span class="punctuation token">,</span> arguments<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+ <span class="punctuation token">}</span>
+ <span class="keyword token">if</span> <span class="punctuation token">(</span>firstIsNode<span class="punctuation token">)</span> parent<span class="punctuation token">.</span><span class="function token">replaceChild</span><span class="punctuation token">(</span>Ele<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>Element<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith<span class="punctuation token">)</span>
+ Element<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith <span class="operator token">=</span> ReplaceWith<span class="punctuation token">;</span>
+<span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>CharacterData<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith<span class="punctuation token">)</span>
+ CharacterData<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith <span class="operator token">=</span> ReplaceWith<span class="punctuation token">;</span>
+<span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>DocumentType<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith<span class="punctuation token">)</span>
+ DocumentType<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>replaceWith <span class="operator token">=</span> ReplaceWith<span class="punctuation token">;</span></code></pre>
+
+<h2 id="Spécification">Spécification</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Spécification</th>
+ <th scope="col">État</th>
+ <th scope="col">Commentaire</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('DOM WHATWG', '#dom-childnode-replacewith', 'ChildNode.replacewith()')}}</td>
+ <td>{{Spec2('DOM WHATWG')}}</td>
+ <td>Définition initiale.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+
+
+
+<p>{{Compat("api.ChildNode.replaceWith")}}</p>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li>{{domxref("ChildNode")}} et {{domxref("ParentNode")}}</li>
+ <li>{{domxref("Node.replaceChild()")}}</li>
+ <li>{{domxref("NodeList")}}</li>
+</ul>