---
title: Node
slug: Web/API/Node
tags:
  - API
  - DOM
  - DOM Reference
  - Interface
  - Node
  - Reference
translation_of: Web/API/Node
---
<div>{{APIRef("DOM")}}</div>

<p><strong><code>Node</code></strong> はいくつもの DOM API オブジェクトタイプが継承しているインターフェイスで、それらのさまざまなタイプを同じように扱える (同じメソッドのセットを継承する、または同じ方法でテストできる) ようにします。</p>

<p>以下のインターフェイスはすべて、<code>Node</code> からメソッドやプロパティを継承しています: {{domxref("Document")}}, {{domxref("Element")}}, {{domxref("Attr")}}, {{domxref("CharacterData")}} (which {{domxref("Text")}}, {{domxref("Comment")}}, and {{domxref("CDATASection")}} inherit), {{domxref("ProcessingInstruction")}}, {{domxref("DocumentFragment")}}, {{domxref("DocumentType")}}, {{domxref("Notation")}}, {{domxref("Entity")}}, {{domxref("EntityReference")}}</p>

<p>これらのインターフェイスは、そのメソッドやプロパティが妥当でないときは null を返すことがあります。例外を投げることもあります - 例えば、子が存在できないノードタイプに子を追加するとき。</p>

<p>{{InheritanceDiagram}}</p>

<h2 id="Properties" name="Properties">プロパティ</h2>

<p><em>親である {{domxref("EventTarget")}}</em> からプロパティを継承します。<sup>[1]</sup></p>

<dl>
 <dt>{{domxref("Node.baseURI")}} {{readonlyInline}}</dt>
 <dd>ベース URL を表す {{domxref("DOMString")}} を返します。ベース URL の概念は、言語によって変わります。HTML ではプロトコル、ドメイン名、ディレクトリー構造に対応しており、最後の <code>'/'</code> までのすべてになります。</dd>
 <dt>{{domxref("Node.baseURIObject")}} {{Non-standard_inline}}</dt>
 <dd>(ウェブコンテンツでは使用できません) 要素のベース URI を表す、読み取り専用の {{Interface("nsIURI")}} オブジェクトを返します。</dd>
 <dt>{{domxref("Node.childNodes")}} {{readonlyInline}}</dt>
 <dd>このノードのすべての子孫を含む、生きている {{domxref("NodeList")}} を返します。{{domxref("NodeList")}} が生きているとは、<code>Node</code> の子が変化すれば自動的に {{domxref("NodeList")}} オブジェクトが更新されることを意味します。</dd>
 <dt>{{domxref("Node.firstChild")}} {{readonlyInline}}</dt>
 <dd>ノードの直下の最初の子ノードを表す {{domxref("Node")}} を返します。子が存在しなければ <code>null</code> を返します。</dd>
 <dt>{{domxref("Node.isConnected")}} {{readonlyInline}}</dt>
 <dd>ノードが(直接/関節的に)コンテキストオブジェクトに接続されているかを示す論理値。例えば通常の DOM の場合は {{domxref("Document")}} オブジェクト、あるいはシャドーDOM の場合は {{domxref("ShadowRoot")}}。</dd>
 <dt>{{domxref("Node.lastChild")}} {{readonlyInline}}</dt>
 <dd>ノードの直下の最後の子ノードを表す {{domxref("Node")}} を返します。子が存在しなければ <code>null</code> を返します。</dd>
 <dt>{{domxref("Node.nextSibling")}} {{readonlyInline}}</dt>
 <dd>ツリー構造で次のノードを表す {{domxref("Node")}} を返します。該当するノードがない場合は <code>null</code> を返します。</dd>
 <dt>{{domxref("Node.nodeName")}} {{readonlyInline}}</dt>
 <dd><code>Node</code> の名前を持つ {{domxref("DOMString")}} を返します。名前の構造は、ノードの型によって異なります。例えば、{{domxref("HTMLElement")}} は {{domxref("HTMLAudioElement")}} に対して <code>'audio'</code> というように対応するタグの名前、{{domxref("Text")}} ノードは <code>'#text'</code> という文字列、{{domxref("Document")}} ノードは <code>'#document'</code> という文字列になります。</dd>
 <dt>{{domxref("Node.nodePrincipal")}} {{Non-standard_inline}}</dt>
 <dd>ノードのプリンシパルを表す {{Interface("nsIPrincipal")}} を返します。</dd>
 <dt>{{domxref("Node.nodeType")}}{{readonlyInline}}</dt>
 <dd>ノードの型を表す <code>unsigned short</code> を返します。使用できる値:
 <table class="standard-table">
  <tbody>
   <tr>
    <th scope="col">名称</th>
    <th scope="col">値</th>
   </tr>
   <tr>
    <td><code>ELEMENT_NODE</code></td>
    <td><code>1</code></td>
   </tr>
   <tr>
    <td><code>ATTRIBUTE_NODE</code> {{deprecated_inline}}</td>
    <td><code>2</code></td>
   </tr>
   <tr>
    <td><code>TEXT_NODE</code></td>
    <td><code>3</code></td>
   </tr>
   <tr>
    <td><code>CDATA_SECTION_NODE</code> {{deprecated_inline}}</td>
    <td><code>4</code></td>
   </tr>
   <tr>
    <td><code>ENTITY_REFERENCE_NODE</code> {{deprecated_inline}}</td>
    <td><code>5</code></td>
   </tr>
   <tr>
    <td><code>ENTITY_NODE</code> {{deprecated_inline}}</td>
    <td><code>6</code></td>
   </tr>
   <tr>
    <td><code>PROCESSING_INSTRUCTION_NODE</code></td>
    <td><code>7</code></td>
   </tr>
   <tr>
    <td><code>COMMENT_NODE</code></td>
    <td><code>8</code></td>
   </tr>
   <tr>
    <td><code>DOCUMENT_NODE</code></td>
    <td><code>9</code></td>
   </tr>
   <tr>
    <td><code>DOCUMENT_TYPE_NODE</code></td>
    <td><code>10</code></td>
   </tr>
   <tr>
    <td><code>DOCUMENT_FRAGMENT_NODE</code></td>
    <td><code>11</code></td>
   </tr>
   <tr>
    <td><code>NOTATION_NODE</code> {{deprecated_inline}}</td>
    <td><code>12</code></td>
   </tr>
  </tbody>
 </table>
 </dd>
 <dt>{{domxref("Node.nodeValue")}}</dt>
 <dd>カレントノードの値を取得または設定します。</dd>
 <dt>{{domxref("Node.ownerDocument")}} {{readonlyInline}}</dt>
 <dd>ノードが所属する {{domxref("Document")}} を返します。ノードが document 自身の場合は、<code>null</code> を返します。</dd>
 <dt>{{domxref("Node.parentNode")}} {{readonlyInline}}</dt>
 <dd>このノードの親の {{domxref("Node")}} を返します。ノードがツリーの最上位である、あるいはツリーに加わっていないなど、親が存在しない場合は <code>null</code> を返します。</dd>
 <dt>{{domxref("Node.parentElement")}} {{readonlyInline}}</dt>
 <dd>このノードの親の {{domxref("Element")}} を返します。ノードに親が存在しない、あるいは親が {{domxref("Element")}} ではない場合は、<code>null</code> を返します。</dd>
 <dt>{{domxref("Node.previousSibling")}} {{readonlyInline}}</dt>
 <dd>ツリー構造で前のノードを表す {{domxref("Node")}} を返します。該当するノードがない場合は <code>null</code> を返します。</dd>
 <dt>{{domxref("Node.textContent")}}</dt>
 <dd>要素や要素のすべての子孫のテキストコンテンツを取得または設定します。</dd>
</dl>

<h3 id="Deprecated_properties" name="Deprecated_properties">非推奨プロパティ</h3>

<dl>
 <dt>{{domxref("Node.rootNode")}} {{readOnlyInline}} {{deprecated_inline}}</dt>
 <dd>ツリーの最上位ノードを表す {{domxref("Node")}} オブジェクトを返します。自身がツリーの最上位ノードである場合はカレントノードを返します。これは {{domxref("Node.getRootNode()")}} に置き換えられました。</dd>
</dl>

<h3 id="Obsolete_properties" name="Obsolete_properties">廃止プロパティ</h3>

<dl>
 <dt>{{domxref("Node.localName")}} {{obsolete_inline}}{{readonlyInline}}</dt>
 <dd>要素の修飾名のローカル部分を表す {{domxref("DOMString")}} を返します。
 <div class="note">
 <p><strong>注記:</strong> Firefox 3.5 および以前のバージョンでは、このプロパティで HTML 要素のローカル名が大文字でした (XHTML 要素を除く)。以降のバージョンではこのようになりませんので、このプロパティでは HTML および XHTML の両方が小文字になります。{{gecko_minversion_inline("1.9.2")}}</p>
 </div>
 </dd>
 <dt>{{domxref("Node.namespaceURI")}} {{obsolete_inline}}{{readonlyInline}}</dt>
 <dd>ノードの名前空間の URI。名前空間がない場合は <code>null</code> になります。
 <div class="note">
 <p><strong>注記:</strong> Firefox 3.5 および以前のバージョンでは、HTML 要素の名前空間はありません。以降のバージョンでは、HTML 要素は HTML ツリーおよび XML ツリーで <code><a class="linkification-ext external" href="https://www.w3.org/1999/xhtml/" title="Linkification: http://www.w3.org/1999/xhtml">https://www.w3.org/1999/xhtml/</a></code> 名前空間内に存在します。{{gecko_minversion_inline("1.9.2")}}</p>
 </div>
 </dd>
 <dt>{{domxref("Node.prefix")}} {{obsolete_inline}}{{readonlyInline}}</dt>
 <dd>ノードの名前空間の接頭辞を表す {{domxref("DOMString")}} を返します。接頭辞が指定されていない場合は <code>null</code> を返します。</dd>
</dl>

<h2 id="Methods" name="Methods">メソッド</h2>

<p><em>親である {{domxref("EventTarget")}}</em> からメソッドを継承します。<sup>[1]</sup></p>

<dl>
 <dt>{{domxref("Node.appendChild()")}}</dt>
 <dd>カレントノードの最後の子として、指定した childNode 引数を追加します。<br>
 引数が DOM ツリー上の既存のノードを参照している場合は、ノードが現在の位置から外されて新しい位置に追加されます。</dd>
 <dt>{{domxref("Node.cloneNode()")}}</dt>
 <dd>{{domxref("Node")}} を複製します。また、すべての内容物を複製することもできます。デフォルトで、ノードの内容物を複製します。</dd>
 <dt>{{domxref("Node.compareDocumentPosition()")}}</dt>
 <dd>カレントノードの位置を、他のドキュメント内の別のノードと比較します。</dd>
 <dt>{{domxref("Node.contains()")}}</dt>
 <dd>ノードが指定したノードの子孫であるか否かを示す {{jsxref("Boolean")}} 値を返します。</dd>
 <dt>{{domxref("Node.getRootNode()")}}</dt>
 <dd>コンテキストオブジェクトのルートを返します。任意で、shadow root が使用可能である場合にそれを含めることができます。</dd>
 <dt>{{domxref("Node.hasChildNodes()")}}</dt>
 <dd>要素が子ノードを持っているか否かを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{domxref("Node.insertBefore()")}}</dt>
 <dd>カレントノードの子として、参照先ノードの前に {{domxref("Node")}} を挿入します。</dd>
 <dt>{{domxref("Node.isDefaultNamespace()")}}</dt>
 <dd>引数として名前空間の URI を受け入れて、名前空間が指定したノードのデフォルトの名前空間であれば <code>true</code>、そうでない場合は <code>false</code> である {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{domxref("Node.isEqualNode()")}}</dt>
 <dd>2 つのノードが同じ型であり、定義されているすべてのデータポイントが一致するか否かを表す {{jsxref("Boolean")}}を返します。</dd>
 <dt>{{domxref("Node.isSameNode()")}}</dt>
 <dd>2 つのノードが同じである (すなわち、同じオブジェクトを参照している) か否かを示す {{jsxref("Boolean")}} 値を返します。</dd>
 <dt>{{domxref("Node.lookupPrefix()")}}</dt>
 <dd>指定した名前空間 URI の接頭辞があれば、その接頭辞を含む {{domxref("DOMString")}} を返します。接頭辞がない場合は <code>null</code> を返します。複数の接頭辞がある場合の結果は実装依存です。</dd>
 <dt>{{domxref("Node.lookupNamespaceURI()")}}</dt>
 <dd>接頭辞を受け入れて、指定したノードで接頭辞が関連付けられた名前空間が見つかった場合は名前空間の URI を返します (見つからない場合は <code>null</code> を返します)。接頭辞として <code>null</code> を与えると、デフォルトの名前空間を返します。</dd>
 <dt>{{domxref("Node.normalize()")}}</dt>
 <dd>要素内のすべてのテキストノードをクリーンアップ (隣接ノードを統合、空のノードを削除) します。</dd>
 <dt>{{domxref("Node.removeChild()")}}</dt>
 <dd>カレント要素から子ノードを削除します。カレント要素はカレントノードの子であることが必要です。</dd>
 <dt>{{domxref("Node.replaceChild()")}}</dt>
 <dd>カレントノードの子 {{domxref("Node")}} のひとつを、引数で指定した別のノードで置き換えます。</dd>
</dl>

<h3 id="Obsolete_methods" name="Obsolete_methods">廃止メソッド</h3>

<dl>
 <dt>{{domxref("Node.getFeature()")}} {{obsolete_inline}}</dt>
 <dd>x</dd>
 <dt>{{domxref("Node.getUserData()")}} {{obsolete_inline}}</dt>
 <dd>ユーザーが、ノードから {{domxref("DOMUserData")}} を取得できます。</dd>
 <dt>{{domxref("Node.hasAttributes()")}} {{obsolete_inline}}</dt>
 <dd>要素がなんらかの属性を持っているか否かを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{domxref("Node.isSupported()")}} {{obsolete_inline}}</dt>
 <dd>DOM 実装が特定の機能を実装しており、またその機能が指定したノードでサポートされているかを確認して、その結果を表す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{domxref("Node.setUserData()")}} {{obsolete_inline}}</dt>
 <dd>ユーザーが、ノードに {{domxref("DOMUserData")}} を追加または削除できます。</dd>
</dl>

<h2 id="Examples" name="Examples">例</h2>

<h3 id="Browse_all_child_nodes" name="Browse_all_child_nodes">すべての子ノードを走査する</h3>

<p>次の関数はすべての子ノードを再帰的にループして、それらに対してコールバック関数を呼び出します。（また、親ノード自身に対しても同様に呼び出されます。</p>

<pre class="brush: js">function DOMComb (oParent, oCallback) {
  if (oParent.hasChildNodes()) {
    for (var oNode = oParent.firstChild; oNode; oNode = oNode.nextSibling) {
      DOMComb(oNode, oCallback);
    }
  }
  oCallback.call(oParent);
}</pre>

<h4 id="Syntax" name="Syntax">構文</h4>

<pre class="syntaxbox">DOMComb(parentNode, callbackFunction);</pre>

<h4 id="Description" name="Description">説明</h4>

<p><code>parentNode</code> のすべての子ノードと <code>parentNode</code> 自身を再帰的にループして、それらを <a href="/ja/docs/JavaScript/Reference/Operators/this" title="JavaScript/Reference/Operators/this"><code>this</code></a> オブジェクトとして <code>callbackFunction</code> を実行します。</p>

<h4 id="Parameters" name="Parameters">引数</h4>

<dl>
 <dt><code>parentNode</code></dt>
 <dd>親ノード (<code><strong>Node</strong> <a href="/ja/docs/JavaScript/Reference/Global_Objects/Object" title="JavaScript/Reference/Global_Objects/Object">Object</a></code>)</dd>
 <dt><code>callbackFunction</code></dt>
 <dd>コールバック関数 (<a href="/ja/docs/JavaScript/Reference/Global_Objects/Function" title="JavaScript/Reference/Global_Objects/Function"><code>Function</code></a>)</dd>
</dl>

<h4 id="Sample_usage" name="Sample_usage">用例</h4>

<p>次の例はボディの中のテキストの内容を <code>console.log</code> に送るものです:</p>

<pre class="brush: js">function printContent () {
  if (this.nodeValue) { console.log(this.nodeValue); }
}

onload = function () {
  DOMComb(document.body, printContent);
};</pre>

<h3 id="Remove_all_children_nested_within_a_node" name="Remove_all_children_nested_within_a_node">ノードに内包されているすべての子ノードを削除する</h3>

<pre class="brush: js">Element.prototype.removeAll = function () {
  while (this.firstChild) { this.removeChild(this.firstChild); }
  return this;
};</pre>

<h4 id="Sample_usage_2" name="Sample_usage_2">使用例</h4>

<pre class="brush: js">/* ... an alternative to document.body.innerHTML = "" ... */
document.body.removeAll();</pre>

<h2 id="Specifications" name="Specifications">仕様</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">仕様書</th>
   <th scope="col">策定状況</th>
   <th scope="col">コメント</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('DOM WHATWG', '#interface-node', 'Node')}}</td>
   <td>{{Spec2('DOM WHATWG')}}</td>
   <td>以下のプロパティを削除: <code>attributes</code>、<code>namespaceURI</code>、<code>prefix</code>、<code>localName</code>。<br>
    以下のメソッドを削除: <code>isSupported()</code>、<code>hasAttributes()</code>、<code>getFeature()</code>、<code>setUserData()</code>、<code>getUserData()</code>。</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM3 Core', 'core.html#ID-1950641247', 'Node')}}</td>
   <td>{{Spec2('DOM3 Core')}}</td>
   <td>{{domxref("Document")}} で <code>insertBefore()</code>、<code>replaceChild()</code>、<code>removeChild()</code>、<code>appendChild()</code> メソッドを呼び出すと、もうひとつの種類のエラー (<code>NOT_SUPPORTED_ERR</code>) を返します。<br>
    <code>normalize()</code> メソッドを、適切な {{domxref("DOMConfiguration")}} フラグが設定されていれば {{domxref("Text")}} ノードも正規化できるように変更。<br>
    以下のメソッドを追加: <code>compareDocumentPosition()</code>、<code>isSameNode()</code>、<code>lookupPrefix()</code>、<code>isDefaultNamespace()</code>、<code>lookupNamespaceURI()</code>、<code>isEqualNode()</code>、<code>getFeature()</code>、<code>setUserData()</code>、<code>getUserData()</code>。<br>
    以下のプロパティを追加: <code>baseURI</code>、<code>textContent</code>。</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM2 Core', 'core.html#ID-1950641247', 'Node')}}</td>
   <td>{{Spec2('DOM2 Core')}}</td>
   <td><code>ownerDocument</code> プロパティを、{{domxref("DocumentFragment")}} が <code>null</code> も返すように若干変更。<br>
    以下のプロパティを追加: <code>namespaceURI</code>、<code>prefix</code>、<code>localName</code>。<br>
    以下のメソッドを追加: <code>normalize()</code>、<code>isSupported()</code>、<code>hasAttributes()</code>。</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM1', 'level-one-core.html#ID-1950641247', 'Node')}}</td>
   <td>{{Spec2('DOM1')}}</td>
   <td>初期定義</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>

<p>{{Compat("api.Node")}}</p>