---
title: element.replaceChild
slug: Web/API/Node/replaceChild
tags:
  - DOM
  - Dokumentacja_Gecko_DOM
  - Gecko
  - Wszystkie_kategorie
translation_of: Web/API/Node/replaceChild
original_slug: Web/API/Element/replaceChild
---
<p>{{ ApiRef() }}</p>
<h3 id="Podsumowanie" name="Podsumowanie">Podsumowanie</h3>
<p>Zastępuje dziecko węzła innym węzłem.</p>
<h3 id="Sk.C5.82adnia" name="Sk.C5.82adnia">Składnia</h3>
<pre class="eval"><i>węzełZastąpiony</i> =<i>węzełRodzic</i>.replaceChild(<i>noweDziecko</i>,<i>stareDziecko</i>);
</pre>
<ul>
 <li><code>noweDziecko</code> to nowy węzeł, który ma zastąpić <code>stareDziecko</code>. Jeśli węzeł ten istnieje już gdzieś indziej w DOM, najpierw jest stamtąd usuwany.</li>
 <li><code>stareDziecko</code> to istniejące dziecko, które ma zostać zastąpione.</li>
 <li><code>węzełZastąpiony</code> to węzeł, który został zastąpiony. Jest to ten sam węzeł, co <code>stareDziecko</code>.</li>
</ul>
<h3 id="Przyk.C5.82ad" name="Przyk.C5.82ad">Przykład</h3>
<pre>// &lt;div&gt;
//  &lt;span id="childSpan"&gt;foo bar&lt;/span&gt;
// &lt;/div&gt;

// utwórz węzeł pustego elementu
// bez ID, atrybutów i zawartości
var sp1 = document.createElement("span");

// nadaj mu ID 'newSpan'
sp1.setAttribute("id", "newSpan");

// utwórz jakąś zawartość dla nowego elementu
var sp1_content = document.createTextNode("Nowy element span.");

// wstaw tę zawartość
sp1.appendChild(sp1_content);

// stwórz referencję do istniejącego węzła, który ma zostać zastąpiony
var sp2 = document.getElementById("childSpan");
var parentDiv = sp2.parentNode;

// zastąp istniejący węzeł sp2 elementem span sp1
parentDiv.replaceChild(sp1, sp2);

</pre>
<h3 id="Specyfikacja" name="Specyfikacja">Specyfikacja</h3>
<p><a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#method-replaceChild">DOM Level 1 Core: replaceChild</a></p>
<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-785887307">DOM Level 2 Core: replaceChild</a></p>
<div class="noinclude">
  </div>
<p>{{ languages( { "en": "en/DOM/element.replaceChild", "fr": "fr/DOM/element.replaceChild", "ja": "ja/DOM/element.replaceChild" } ) }}</p>