aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/element/childelementcount
diff options
context:
space:
mode:
authorMDN <actions@users.noreply.github.com>2021-03-24 00:27:57 +0000
committerMDN <actions@users.noreply.github.com>2021-03-24 00:27:57 +0000
commit8d7ad7715e19a445def22de6d5f3d9519cebe69e (patch)
treedfeab89fe885baadfaa3629850e4dbf53a9a8669 /files/zh-cn/web/api/element/childelementcount
parent0511ab6f682be0c8401377e50cd4a164e87ec589 (diff)
downloadtranslated-content-8d7ad7715e19a445def22de6d5f3d9519cebe69e.tar.gz
translated-content-8d7ad7715e19a445def22de6d5f3d9519cebe69e.tar.bz2
translated-content-8d7ad7715e19a445def22de6d5f3d9519cebe69e.zip
[CRON] sync translated content
Diffstat (limited to 'files/zh-cn/web/api/element/childelementcount')
-rw-r--r--files/zh-cn/web/api/element/childelementcount/index.html153
1 files changed, 153 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/element/childelementcount/index.html b/files/zh-cn/web/api/element/childelementcount/index.html
new file mode 100644
index 0000000000..11a680d8a0
--- /dev/null
+++ b/files/zh-cn/web/api/element/childelementcount/index.html
@@ -0,0 +1,153 @@
+---
+title: ParentNode.childElementCount
+slug: Web/API/Element/childElementCount
+translation_of: Web/API/ParentNode/childElementCount
+original_slug: Web/API/ParentNode/childElementCount
+---
+<p>{{ APIRef("DOM") }} </p>
+
+<p> <code><strong>ParentNode.childElementCount </strong></code>只读属性返回一个<em><strong>无符号长整型数字</strong></em>,表示给定元素的子元素数。</p>
+
+<div class="note">
+<p>This property was initially defined in the {{domxref("ElementTraversal")}} pure interface. As this interface contained two distinct set of properties, one aimed at {{domxref("Node")}} that have children, one at those that are children, they have been moved into two separate pure interfaces, {{domxref("ParentNode")}} and {{domxref("ChildNode")}}. In this case, <code>childElementCount</code> moved to {{domxref("ParentNode")}}. This is a fairly technical change that shouldn't affect compatibility.</p>
+</div>
+
+<p> </p>
+
+<h2 id="Syntax_and_values" name="Syntax_and_values">语法</h2>
+
+<pre>var <var>count</var> = <em>node</em>.childElementCount;</pre>
+
+<pre class="eval">var <em>elCount</em> = elementNodeReference.childElementCount;
+</pre>
+
+<dl>
+ <dt>count</dt>
+ <dd>holds the return value an <code>unsigned long </code>(simply an integer) type.</dd>
+ <dt>node</dt>
+ <dd>is an object representing a <code>Document</code>, <code>DocumentFragment</code> or <code>Element</code>.</dd>
+</dl>
+
+<h2 id="例子">例子</h2>
+
+<pre><code>var foo = document.getElementById("foo");
+if (foo.childElementCount &gt; 0) {
+ // do something
+}</code></pre>
+
+<p>下例演示了一个元素节点的<code>childElementCount</code>属性以及<code>children</code>属性的用法.</p>
+
+<pre class="eval">&lt;head&gt;
+    &lt;script type="text/javascript"&gt;
+        function GetChildCount () {
+            var container = document.getElementById ("container");
+
+            var childCount = 0;
+            //如果支持childElementCount属性
+            if ('childElementCount' in container) {
+                childCount = container.childElementCount;
+            }
+            else {
+            //如果支持children属性,IE6/7/8
+            //译者注:没有判断nodeType是否为1,可能包含注释节点.
+                if (container.children) {
+                    childCount = container.children.length;
+                }
+                else {  //,如果都不支持,Firefox 3.5之前版本
+                    var child = container.firstChild;
+                    while (child) {
+                        if (child.nodeType == 1 /*Node.ELEMENT_NODE*/) {
+                            childCount++;
+                        }
+                        child = child.nextSibling;
+                    }
+                }
+            }
+
+            alert ("The number of child elements is " + childCount);
+        }
+    &lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;
+    &lt;div id="container" style="width:300px; background-color:#a0d0e0;"&gt;
+        Some text inside the container.
+        &lt;input type="text" size="40" value="a child element of the container" /&gt;
+        &lt;div&gt;
+            &lt;div&gt;a descendant element of the container&lt;/div&gt;
+            &lt;div&gt;another descendant element of the container&lt;/div&gt;
+        &lt;/div&gt;
+    &lt;/div&gt;
+    &lt;br /&gt;&lt;br /&gt;
+    &lt;button onclick="GetChildCount ();"&gt;Get the number of container's child elements&lt;/button&gt;
+&lt;/body&gt;
+</pre>
+
+<div>执行上面的例子:<a class="external" href="http://help.dottoro.com/external/examples/ljsfamht/childElementCount_1.htm" title="http://help.dottoro.com/external/examples/ljsfamht/childElementCount_1.htm">http://help.dottoro.com/external/examples/ljsfamht/childElementCount_1.htm</a></div>
+
+<p> </p>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Firefox (Gecko)</th>
+ <th>Chrome</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{ CompatGeckoDesktop("3") }}</td>
+ <td>{{ CompatVersionUnknown() }}</td>
+ <td>9.0</td>
+ <td>{{ CompatVersionUnknown() }}</td>
+ <td>{{ CompatVersionUnknown() }}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Android</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>?</td>
+ <td>?</td>
+ <td>?</td>
+ <td>?</td>
+ <td>?</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Specification" name="Specification">规范</h2>
+
+<p><a href="http://www.w3.org/TR/2008/WD-ElementTraversal-20080303/#attribute-childElementCount" rel="nofollow">childElementCount (W3C)</a></p>
+
+<h2 id="相关链接">相关链接</h2>
+
+<ul>
+ <li><a class="internal" href="/zh-cn/DOM/Element.children" title="zh-cn/DOM/Element.children"><code>children</code></a></li>
+ <li><a class="internal" href="/zh-cn/DOM/Element.firstElementChild" title="zh-cn/DOM/Element.firstElementChild"><code>firstElementChild</code></a></li>
+ <li><a class="internal" href="/zh-cn/DOM/Element.lastElementChild" title="zh-cn/DOM/Element.lastElementChild"><code>lastElementChild</code></a></li>
+ <li><a class="internal" href="/zh-cn/DOM/Element.nextElementSibling" title="zh-cn/DOM/Element.nextElementSibling"><code>nextElementSibling</code></a></li>
+ <li><a class="internal" href="/zh-cn/DOM/element.previousElementSibling" title="zh-cn/DOM/Element.previousElementSibling"><code>previousElementSibling</code></a></li>
+</ul>
+
+<p> </p>