files/pl/web/api/element/insertbefore/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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86

---
title: element.insertBefore
slug: Web/API/Element/insertBefore
tags:
  - DOM
  - Dokumentacja_Gecko_DOM
  - Gecko
  - Wszystkie_kategorie
translation_of: Web/API/Node/insertBefore
---
<p>{{ ApiRef() }}</p>

<h3 id="Podsumowanie" name="Podsumowanie">Podsumowanie</h3>

<p>Wstawia określony węzeł przed danym elementem jako dziecko aktualnego węzła.</p>

<h3 id="Sk.C5.82adnia" name="Sk.C5.82adnia">Składnia</h3>

<pre class="eval">var <em>wstawionyElement</em> =<em>elementRodzic</em>.insertBefore(<em>nowyElement</em>,<em>danyElement</em>)
</pre>

<p>Jeżeli <var>danyElement</var> ma wartość <code>null</code>, <var>nowyElement</var> jest wstawiany na końcu listy węzłów potomnych.</p>

<ul>
 <li><code>nowyElement</code> Węzeł do wstawienia.</li>
 <li><code>danyElement</code> Węzeł przed którym <code>nowyElement</code> ma zostać wstawiony.</li>
 <li><code>elementRodzic</code> Rodzic nowo wstawianego elementu.</li>
 <li><code>wstawionyElement</code> Węzeł, który jest wstawiany, czyli <code>nowyElement</code>.</li>
</ul>

<h3 id="Przyk.C5.82ad" name="Przyk.C5.82ad">Przykład</h3>

<pre> &lt;html&gt;

 &lt;head&gt;
 &lt;title&gt;Gecko DOM insertBefore test&lt;/title&gt;
 &lt;/head&gt;

 &lt;body&gt;
 &lt;div&gt;
   &lt;span id="childSpan"&gt;foo bar&lt;/span&gt;
 &lt;/div&gt;

 &lt;script type="text/javascript"&gt;
 // tworzy pusty węzeł elementu
 // bez ID, jakichkolwiek atrybutów lub jakiejkolwiek zawartości
 var sp1 = document.createElement("span");

 // daje to atrybut id nazwany 'newSpan'
 sp1.setAttribute("id", "newSpan");

 // tworzy jakąś zawartość dla nowo powstałego elementu.
 var sp1_content = document.createTextNode("Jest to nowy element span. ");

 // zwraca się, która treść ma być do nowego elementu.
 sp1.appendChild(sp1_content);

 var sp2 = document.getElementById("childSpan");
 var parentDiv = sp2.parentNode;

 // wstawia nowy element do DOM przed sp2
 parentDiv.insertBefore(sp1, sp2);
 &lt;/script&gt;

 &lt;/body&gt;
 &lt;/html&gt;
</pre>

<p>Nie istnieje metoda <code>insertAfter</code>, jednak można ją emulować poprzez kombinację <code>insertBefore</code> oraz <code><a href="pl/DOM/element.nextSibling">nextSibling</a></code>.</p>

<p>W powyższym przykładzie, <code>sp1</code> może zostać wstawiona za <code>sp2</code> przy użyciu:</p>

<pre class="eval">parentDiv.insertBefore(sp1, sp2.nextSibling);
</pre>

<p>Jeżeli <code>sp2</code> nie posiada następnego rodzeństwa i musi być ostatnim potomnym —<code>sp2.nextSibling</code> to zwróci <code>null</code> więc <code>sp1</code> będzie wstawione na końcu listy węzłów potomnych (np. natychmiast po <code>sp2</code>).</p>

<h3 id="Specyfikacja" name="Specyfikacja">Specyfikacja</h3>

<p><a class="external" href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html#ID-952280727">insertBefore</a></p>

<p> </p>

<div class="noinclude"> </div>

<p>{{ languages( { "en": "en/DOM/element.insertBefore", "fr": "fr/DOM/element.insertBefore", "ja": "ja/DOM/element.insertBefore", "pt": "pt/DOM/element.insertBefore" } ) }}</p>