aboutsummaryrefslogtreecommitdiff
path: root/files/pl/web/api/element/firstchild/index.html
blob: 20189ce80310fea0921c12296037999dd57954e9 (plain)
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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
---
title: element.firstChild
slug: Web/API/Element/firstChild
tags:
  - DOM
  - Dokumentacja_Gecko_DOM
  - Gecko
  - Wszystkie_kategorie
translation_of: Web/API/Node/firstChild
---
<p>{{ ApiRef() }}</p>

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

<p><strong>firstChild</strong> jest właściwością tylko do odczytu, która zwraca pierwszego potomka węzła lub wartość null, jeżeli węzeł nie ma potomków. Jeżeli węzeł jest elementem Document, wtedy zwraca pierwszy węzeł z listy swoich bezpośrednich dzieci.</p>

<h3 id="Sk.C5.82adnia_i_warto.C5.9Bci" name="Sk.C5.82adnia_i_warto.C5.9Bci">Składnia i wartości</h3>

<pre class="notranslate">var elt = element.firstChild;
</pre>

<p><var>elt</var> to referencja do pierwszego dziecka elementu, jeśli jest takie - w przeciwnym razie jest to null.</p>

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

<p>Przeglądarki oparte o Gecko wstawiają do dokumentu węzły tekstowe reprezentujące białe znaki w kodzie. Dlatego pierwsze dziecko elementu może odnosić się do wstawionego węzła tekstowego, a nie elementu określonego przez następny znacznik w źródle strony.</p>

<pre class="notranslate">&lt;p id="para-01"&gt;
  &lt;span&gt;Pierwszy span&lt;/span&gt;
&lt;/p&gt;

&lt;script type="text/javascript"&gt;
  var p01 = document.getElementById('para-01');
  alert(p01.firstChild.nodeName)
&lt;/script&gt;
</pre>

<p>W powyższym przykładzie alert wyświetli '#text', ponieważ wstawiony jest węzeł tekstowy oznaczający przerwę między otwierającymi znacznikami &lt;p&gt; i &lt;span&gt; . Dowolny biały znak spowoduje wstawienie węzła tekstowego - zarówno pojedyncza spacja, jak i dowolna ilość spacji, nowych linii, znaków tabulacji itd.</p>

<p>Kolejny węzeł #text jest wstawiany między zamykającymi znacznikami &lt;/span&gt; i &lt;/p&gt;</p>

<p>Jeśli usunie się białe znaki ze źródła, nie zostaną wstawione węzły tekstowe, a element <code>span</code> stanie się pierwszym dzieckiem paragrafu.</p>

<pre class="notranslate">&lt;p id="para-01"&gt;&lt;span&gt;Pierwszy span&lt;/span&gt;&lt;/p&gt;

&lt;script type="text/javascript"&gt;
  var p01 = document.getElementById('para-01');
  alert(p01.firstChild.nodeName)
&lt;/script&gt;
</pre>

<p>Teraz alert wyświetli 'SPAN'.</p>

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

<p>Więcej o problemach z węzłami-zjawami znajdziesz w {{ Bug(26179) }} (nie komentuj tego błędu!). Oto jeden ze sposobów na ominięcie problemu:</p>

<pre class="notranslate">&lt;!-- konwencjonalne formatowanie prowadzi do
     zaśmiecenia drzewa dokumentu w Gecko
 --&gt;
&lt;div&gt;
 &lt;ul&gt;
  &lt;li&gt;Pozycja 1&lt;/li&gt;
  &lt;li&gt;Pozycja 2&lt;/li&gt;
  &lt;li&gt;Pozycja 3&lt;/li&gt;
 &lt;/ul&gt;
&lt;/div&gt;

&lt;!-- Formatowanie ustawione, by ominąć
     problem węzłów-zjaw
 --&gt;
&lt;div
 &gt;&lt;ul
  &gt;&lt;li&gt;Pozycja 1&lt;/li
  &gt;&lt;li&gt;Pozycja 2&lt;/li
  &gt;&lt;li&gt;Pozycja 3&lt;/li
 &gt;&lt;/ul
&gt;&lt;/div&gt;
</pre>

<h4 id="W.C4.99z.C5.82y_bezdzietne" name="W.C4.99z.C5.82y_bezdzietne">Węzły bezdzietne</h4>

<p>Własność zwraca <code>null</code>, jeśli bieżący węzeł jest bezdzietny.</p>

<h4 id="Bia.C5.82e_znaki_i_w.C4.99z.C5.82y_dzieci" name="Bia.C5.82e_znaki_i_w.C4.99z.C5.82y_dzieci">Białe znaki i węzły dzieci</h4>

<p>Węzły #text mogą być wstawione jako dzieci elementów takich jak TR pomimo że specyfikacja HTML pozwala tylko na TD jako ich dzieci. Z uwagi na XML białe znaki muszą zostać zachowane i gdzieś wstawione.</p>

<p>Ponieważ węzły #text nie są elementami HTML, białe znaki są tam wstawiane.</p>

<p><a class="external" href="http://www.w3.org/DOM/faq.html#emptytext">W3C DOM 3 FAQ: Why are some Text nodes empty?</a></p>

<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#attribute-firstChild">DOM Level 1 Core: firstChild</a></p>

<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-169727388">DOM Level 2 Core: firstChild</a></p>

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

<p>{{ languages( { "en": "en/DOM/element.firstChild", "fr": "fr/DOM/element.firstChild", "ja": "ja/DOM/element.firstChild", "zh-cn": "cn/DOM/element.firstChild" } ) }}</p>