--- title: ParentNode.children slug: Web/API/ParentNode/children tags: - API - Child - Child Nodes - DOM - HTMLCollection - Node - ParentNode - Property - children translation_of: Web/API/ParentNode/children ---
{{ APIRef("DOM") }}

{{domxref("ParentNode")}} の children プロパティは、呼び出された際のノードの子{{domxref("Element", "要素", "", 1)}}ノードをすべて含んだ動的な（生きている） {{domxref("HTMLCollection")}} を返す、読み取り専用プロパティです。

構文

let children = node.children;

値

node の子の DOM要素の生きている順序付きコレクションの、 {{ domxref("HTMLCollection") }} です。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。

ノードが子要素を持たない場合、 children は要素を含まず、length は 0 です。

例 

const foo = document.getElementById('foo');
for (let i = 0; i < foo.children.length; i++) {
  console.log(foo.children[i].tagName);
}

Polyfill

// Overwrites native 'children' prototype.
// Adds Document & DocumentFragment support for IE9 & Safari.
// Returns array instead of HTMLCollection.
;(function(constructor) {
  if (constructor &&
    constructor.prototype &&
    constructor.prototype.children == null) {
    Object.defineProperty(constructor.prototype, 'children', {
      get: function() {
        let i = 0, node, nodes = this.childNodes, children = [];
        while (node = nodes[i++]) {
          if (node.nodeType === 1) {
            children.push(node);
          }
        }
        return children;
      }
    });
  }
})(window.Node || window.Element);

仕様

仕様 状態 コメント
{{SpecName('DOM WHATWG', '#dom-parentnode-children', 'ParentNode.children')}} {{Spec2('DOM WHATWG')}} 初めての定義

ブラウザー実装状況

{{Compat("api.ParentNode.children")}}

関連情報