diff options
author | MDN <actions@users.noreply.github.com> | 2021-03-24 00:27:57 +0000 |
---|---|---|
committer | MDN <actions@users.noreply.github.com> | 2021-03-24 00:27:57 +0000 |
commit | 8d7ad7715e19a445def22de6d5f3d9519cebe69e (patch) | |
tree | dfeab89fe885baadfaa3629850e4dbf53a9a8669 /files/zh-cn/web/api/element/childelementcount | |
parent | 0511ab6f682be0c8401377e50cd4a164e87ec589 (diff) | |
download | translated-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.html | 153 |
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 > 0) { + // do something +}</code></pre> + +<p>下例演示了一个元素节点的<code>childElementCount</code>属性以及<code>children</code>属性的用法.</p> + +<pre class="eval"><head> + <script type="text/javascript"> + 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); + } + </script> +</head> +<body> + <div id="container" style="width:300px; background-color:#a0d0e0;"> + Some text inside the container. + <input type="text" size="40" value="a child element of the container" /> + <div> + <div>a descendant element of the container</div> + <div>another descendant element of the container</div> + </div> + </div> + <br /><br /> + <button onclick="GetChildCount ();">Get the number of container's child elements</button> +</body> +</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> |