files/ru/web/api/parentnode/children/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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143

---
title: Node.children
slug: Web/API/ParentNode/children
tags:
  - API
  - DOM
  - ParentNode
  - Property
  - Reference
translation_of: Web/API/ParentNode/children
---
<p>{{ APIRef("DOM") }}</p>

<h2 id="Описание">Описание</h2>

<p>Свойство <span class="seoSummary"><code><strong>children</strong></code> </span> {{domxref("ParentNode")}} является свойством только для чтения, которое возвращает {{domxref("HTMLCollection")}}, содержащее все дочерние {{domxref("Element", "elements")}} узла, на котором он был вызван.</p>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="syntaxbox">var <em>elList</em> = elementNodeReference.children; </pre>

<p><var>В результате,</var><code><var> <strong>elList</strong> - </var></code><var>живая коллекция, состоящая из дочерних элементов узла</var><code><var> <strong>elementNodeReference</strong></var></code>, и стоит подметить, что если у узла детей нет, она будет пустой. Определить это можно, обратившись к свойству length, которое содержит в себе количество элементов в коллекции.</p>

<h2 id="Пример">Пример</h2>

<pre class="brush: js">&lt;ul&gt;
   &lt;li&gt;1 пункт&lt;/li&gt;
   &lt;li&gt;2 пункт&lt;/li&gt;
&lt;/ul&gt;

&lt;script type="text/javascript"&gt;

   var elementChildrens = document.querySelector("ul").children;
   for (var i=0, child; child=elementChildrens[i]; i++) {
        //elementChildrens - коллеция детей списка
        //child - последовательно, каждый из элементов elementChildrens
        alert(child.innerHTML);
   }

&lt;/script&gt;

</pre>

<h2 id="Спецификация">Спецификация</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Комментарий</th>
  </tr>
  <tr>
   <td>{{SpecName('DOM WHATWG', '#dom-parentnode-children', 'ParentNode.children')}}</td>
   <td>{{Spec2('DOM WHATWG')}}</td>
   <td>Начальное определение.</td>
  </tr>
 </tbody>
</table>

<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Особенность</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Базовая поддержка {{domxref("Element")}}</td>
   <td>1.0</td>
   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
   <td>9.0 [1]</td>
   <td>10.0</td>
   <td>4.0</td>
  </tr>
  <tr>
   <td>
    <p>Поддержка {{domxref("Document")}} и {{domxref("DocumentFragment")}} {{experimental_inline}}</p>
   </td>
   <td>29.0</td>
   <td>{{CompatGeckoDesktop("25.0")}}</td>
   <td>{{CompatNo}}</td>
   <td>16.0</td>
   <td>{{CompatNo}}</td>
  </tr>
  <tr>
   <td>Поддержка {{domxref("SVGElement")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Особенность</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Базовая поддержка {{domxref("Element")}}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{CompatGeckoMobile("1.9.1")}}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
  </tr>
  <tr>
   <td>Поддержка {{domxref("Document")}} и {{domxref("DocumentFragment")}} {{experimental_inline}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("25.0")}}</td>
   <td>{{CompatNo}}</td>
   <td>16.0</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>Internet Explorer 6, 7 и 8 поддерживают данное свойство, но ошибочно включают в коллекцию комментарии ({{domxref("Comment")}}) в HTML-коде.</p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li>Свойства {{domxref("ParentNode")}} и {{domxref("ChildNode")}}.</li>
</ul>