【PHP8.x】Dom\HTMLElement::cloneNode()メソッドの使い方

cloneNodeメソッドの使い方について、初心者にもわかりやすく解説します。

作成日: 2025年09月11日更新日: 2025年11月23日

基本的な使い方

cloneNodeメソッドは、DOM (Document Object Model) の HTMLElement オブジェクトの複製を作成するメソッドです。HTMLElement は、HTML ドキュメント内の個々の要素（例えば、<p>、<div>、<span>など）を表すオブジェクトです。

このメソッドを使用することで、既存の要素を元に、新しい要素を効率的に生成できます。cloneNodeメソッドは、引数に deep という名前のオプションの boolean 値を受け取ります。

deep 引数が true の場合、要素の全ての子孫ノード（子要素、テキストノード、属性など）を含む、要素の完全な複製が作成されます。deep 引数が false の場合（または省略された場合）、要素自体のみが複製され、子孫ノードは複製されません。この場合、新しい要素は親要素を持たない状態となります。

cloneNodeメソッドは、複製された HTMLElement オブジェクトを返します。この新しいオブジェクトは、元のオブジェクトとは別のオブジェクトであり、DOMツリーに挿入されるまでドキュメントには表示されません。複製された要素をDOMツリーに追加するには、appendChildなどのメソッドを使用します。

このメソッドは、例えば既存の要素のスタイルや属性を維持したまま、同様の要素を複数生成したい場合に非常に役立ちます。また、複雑な構造を持つ要素を再利用する際に、DOM操作のパフォーマンスを向上させることにも貢献します。

構文(syntax)


1Dom\HTMLElement::cloneNode(bool $deep = false): Dom\Node

引数(parameters)

bool $deep = false

bool $deep = false: trueの場合、ノードとそのすべての子孫ノードを複製します。falseの場合、ノードのみを複製し、子ノードは複製しません。

戻り値(return)

Dom\Node

このメソッドは、呼び出し元の Dom\HTMLElement オブジェクトのディープコピーを返します。返される Dom\Node オブジェクトは、元の要素とそのすべての子孫要素を複製したものです。

サンプルコード

PHP DOM要素を複製する cloneNode


1<?php
2
3// PHP 8 の Dom\HTMLElement::cloneNode メソッドの利用例です。
4// このメソッドはHTML要素を複製するために使用され、PHPの組み込みのオブジェクトクローン機能（`clone`キーワード）とは異なります。
5// 'php clone とは' の文脈で、DOM (Document Object Model) 要素の「複製」について学びます。
6
7function demonstrateDomCloneNode(): void
8{
9    // 1. 新しい Dom\Document を作成します。これはHTMLドキュメント全体を表します。
10    // PHP 8 からは、DOM拡張の主要なクラスが `Dom\` 名前空間に属します。
11    $doc = new Dom\Document('1.0', 'UTF-8');
12    $doc->formatOutput = true; // 出力を整形して見やすくします
13
14    // 2. HTMLのルート要素 <html> を作成し、ドキュメントに追加します。
15    $html = $doc->createElement('html');
16    $doc->appendChild($html);
17
18    // 3. <body> 要素を作成し、<html> の子として追加します。
19    $body = $doc->createElement('body');
20    $html->appendChild($body);
21
22    // 4. 複製元の <div> 要素を作成します。この要素が Dom\HTMLElement の一例です。
23    // createElement は Dom\Element を返しますが、Dom\Element は Dom\HTMLElement を継承しており、
24    // cloneNode メソッドは Dom\Node クラスから継承されています。
25    /** @var Dom\HTMLElement $originalDiv */
26    $originalDiv = $doc->createElement('div');
27    $originalDiv->setAttribute('id', 'original-div');
28    $body->appendChild($originalDiv);
29
30    // 5. 元の <div> の中に子要素 <p> を追加します。
31    $paragraph = $doc->createElement('p', 'これは元の段落です。');
32    $originalDiv->appendChild($paragraph);
33
34    // 6. さらに子要素 <span> を <p> の中に追加します。
35    $span = $doc->createElement('span', '（元のスパン）');
36    $paragraph->appendChild($span);
37
38    echo "--- 元のHTML構造 ---\n";
39    // 現在のDOM構造をHTML文字列として出力します。
40    echo $doc->saveHTML() . "\n";
41
42    // --- 例1: cloneNode(false) - シャロークローン (浅い複製) ---
43    // 引数 $deep が false の場合、ノード自身は複製されますが、その子ノード（<p> や <span>）は複製されません。
44    // cloneNode の戻り値は Dom\Node ですが、ここでは元の要素と同じく Dom\HTMLElement として扱えます。
45    /** @var Dom\HTMLElement $shallowClonedDiv */
46    $shallowClonedDiv = $originalDiv->cloneNode(false);
47    $shallowClonedDiv->setAttribute('id', 'shallow-cloned-div');
48    // シャロークローンされた要素のテキストコンテンツを設定します。子ノードは複製されていないため、直接テキストを設定します。
49    $shallowClonedDiv->textContent = 'これはシャロークローンされたdivです。子ノードはありません。';
50    $body->appendChild($shallowClonedDiv);
51
52    echo "--- シャロークローン後のHTML構造 (子ノードは複製されない) ---\n";
53    echo $doc->saveHTML() . "\n";
54
55    // --- 例2: cloneNode(true) - ディープクローン (深い複製) ---
56    // 引数 $deep が true の場合、ノード自身と、そのすべての子ノードが再帰的に複製されます。
57    // 元の構造（<div>, <p>, <span>）が完全にコピーされます。
58    /** @var Dom\HTMLElement $deepClonedDiv */
59    $deepClonedDiv = $originalDiv->cloneNode(true);
60    $deepClonedDiv->setAttribute('id', 'deep-cloned-div');
61    // ディープクローンされた要素の子ノードの内容を変更して、複製されていることを確認します。
62    // firstElementChild は Dom\Element または Dom\HTMLElement を返す可能性があります。
63    if ($deepClonedDiv->firstElementChild instanceof Dom\Element) {
64        $deepClonedDiv->firstElementChild->textContent = 'これはディープクローンされた段落です。';
65        if ($deepClonedDiv->firstElementChild->firstElementChild instanceof Dom\Element) {
66             $deepClonedDiv->firstElementChild->firstElementChild->textContent = '（ディープクローンのスパン）';
67        }
68    }
69    $body->appendChild($deepClonedDiv);
70
71    echo "--- ディープクローン後のHTML構造 (子ノードもすべて複製される) ---\n";
72    echo $doc->saveHTML() . "\n";
73}
74
75// デモンストレーション関数の実行
76demonstrateDomCloneNode();

PHP 8のDom\HTMLElement::cloneNodeメソッドは、HTMLドキュメント内のHTML要素を複製するために利用されます。これは、PHPオブジェクト自体を複製する一般的なcloneキーワードとは異なり、DOM（Document Object Model）ツリー構造における特定のノードを複製する際に使用する機能です。

このメソッドは、bool $deepという引数を持ち、デフォルトはfalseです。$deepをfalseに設定すると、ターゲットとなる要素自身のみが複製され、その要素に含まれる子要素やテキストコンテンツは複製されません（シャロークローン）。一方、$deepをtrueに設定すると、ターゲットとなる要素自身に加えて、その全ての子要素や属性なども再帰的に複製されます（ディープクローン）。これにより、元の要素と全く同じ構造を持つ新しい要素のツリーを生成できます。

メソッドの戻り値はDom\Node型であり、これは複製された新しいノードを表します。この複製されたノードは、元のノードとは独立した存在として扱われ、appendChildなどのDOM操作メソッドを使って、ドキュメント内の任意の場所に追加して活用することが可能です。既存のHTML要素をテンプレートとして再利用し、同じ構造の要素を効率的に生成したい場合に非常に役立ちます。

Dom\HTMLElement::cloneNodeメソッドは、PHPの組み込みcloneキーワードとは異なり、HTML要素をDOMツリー内で複製するための専用機能です。引数$deepの指定が重要で、falseの場合は要素自身のみが複製され、子要素は含まれません。一方、trueを指定すると、要素とそのすべての子孫要素が完全に複製されるため、目的の複製方法に合わせて選択してください。複製されたノードは元のDOMツリーに自動的に追加されないため、必ずappendChildなどのメソッドを使って手動で追加する必要があります。戻り値はDom\Node型ですが、多くの場合、複製元と同じ具体的な型として扱えます。

PHP cloneNodeで要素をコピーする


1<?php
2
3// Dom\Document クラスをインスタンス化
4// これはPHP 8.2以降で利用可能な新しいDOM拡張の一部です。
5$dom = new Dom\Document();
6$dom->encoding = 'UTF-8'; // 文字エンコーディングを設定
7
8// HTML要素を作成し、子孫要素を持つツリーを構築
9// originalDiv が Dom\HTMLElement のインスタンスとなります。
10/** @var Dom\HTMLElement $originalDiv */
11$originalDiv = $dom->createElement('div');
12$originalDiv->setAttribute('id', 'original-container');
13$originalDiv->appendChild($dom->createTextNode('これは元のコンテナです。'));
14
15// 子要素の段落を作成
16/** @var Dom\HTMLElement $childP */
17$childP = $dom->createElement('p');
18$childP->setAttribute('class', 'child-paragraph');
19$childP->appendChild($dom->createTextNode('これは子要素の段落です。'));
20
21// 孫要素のspanを作成
22/** @var Dom\HTMLElement $grandchildSpan */
23$grandchildSpan = $dom->createElement('span');
24$grandchildSpan->setAttribute('style', 'color: blue;');
25$grandchildSpan->appendChild($dom->createTextNode('そしてこれは孫要素のspanです。'));
26
27// 子要素に孫要素を追加し、元のコンテナに子要素を追加
28$childP->appendChild($grandchildSpan);
29$originalDiv->appendChild($childP);
30
31// 作成した元の要素をドキュメントに追加 (HTML出力のために必要)
32$dom->appendChild($originalDiv);
33
34echo "--- 元の要素 ---" . PHP_EOL;
35// saveHTML() を使用して、元の要素のHTML構造を表示
36echo $dom->saveHTML($originalDiv) . PHP_EOL . PHP_EOL;
37
38// cloneNode(false) の例: ディープコピーしない (子ノードを含まない)
39// $deep = false の場合、要素自体はクローンされますが、その子ノード（この場合 <p> とその中の <span>）はクローンされません。
40echo "--- cloneNode(false) の結果 (ディープコピーなし) ---" . PHP_EOL;
41/** @var Dom\HTMLElement $clonedShallow */
42$clonedShallow = $originalDiv->cloneNode(false);
43$clonedShallow->setAttribute('id', 'cloned-shallow'); // クローンされた要素のIDを変更して区別
44echo $dom->saveHTML($clonedShallow) . PHP_EOL . PHP_EOL;
45
46// cloneNode(true) の例: ディープコピーする (子ノードも含む)
47// $deep = true の場合、要素自体と、そのすべての子孫ノードがクローンされます。
48echo "--- cloneNode(true) の結果 (ディープコピーあり) ---" . PHP_EOL;
49/** @var Dom\HTMLElement $clonedDeep */
50$clonedDeep = $originalDiv->cloneNode(true);
51$clonedDeep->setAttribute('id', 'cloned-deep'); // クローンされた要素のIDを変更して区別
52echo $dom->saveHTML($clonedDeep) . PHP_EOL . PHP_EOL;
53
54// 元の要素とクローンされた要素は、それぞれ異なるオブジェクトであることを確認
55echo "--- オブジェクトの同一性確認 ---" . PHP_EOL;
56echo "元の要素と浅いクローンは同じオブジェクトか？ " . ($originalDiv === $clonedShallow ? "はい" : "いいえ") . PHP_EOL;
57echo "元の要素と深いクローンは同じオブジェクトか？ " . ($originalDiv === $clonedDeep ? "はい" : "いいえ") . PHP_EOL;
58
59// 結果として、cloneNode(false) では子要素が失われていることが確認できます。
60// cloneNode(true) では子要素と孫要素が完全にコピーされていることが確認できます。

PHPのDom\HTMLElement::cloneNodeメソッドは、既存のHTML要素（ノード）の複製を作成するために使用されます。このメソッドは、指定された要素の全く新しいコピーを生成し、元の要素とは独立したオブジェクトとして返します。

引数$deepは真偽値（boolean）で、デフォルトはfalseです。この引数は、要素をどこまで深くコピーするかを決定します。 $deepをfalseに設定した場合、対象の要素自体はコピーされますが、その要素が持つ子要素やテキストノードなどの「子孫ノード」はコピーされません。これを「浅いコピー」と呼びます。一方、$deepをtrueに設定すると、対象の要素だけでなく、そのすべての属性、およびすべての「子孫ノード」まで含めて完全に複製されます。これを「深いコピー」と呼びます。

メソッドの戻り値はDom\Nodeオブジェクトであり、これは新しく作成された複製ノードです。この複製ノードは元のノードとは別のメモリ空間に存在するため、複製後に内容を変更しても元のノードには影響を与えません。

サンプルコードでは、子要素や孫要素を持つdiv要素をまず作成しています。次にcloneNode(false)を実行して浅いコピーを作成し、子要素がコピーされていないことを示しています。その後、cloneNode(true)を実行して深いコピーを作成し、要素とすべてのその子孫要素が完全に複製されていることを明確に確認できます。この例を通じて、$deep引数の違いがコピー結果にどう影響するかを具体的に理解することが可能です。

cloneNodeメソッドは、DOM要素を複製するために使用されます。引数$deepにfalseを指定すると、要素自身はコピーされますが、その子要素や孫要素はコピーされません（浅いコピー）。trueを指定すると、要素自身と全ての子孫要素が完全にコピーされます（深いコピー）。複製された要素は元の要素とは異なる新しいオブジェクトとして扱われるため、独立して操作できます。元の要素への変更が複製された要素に影響しないことを理解しておくことが重要です。これにより、既存のDOM構造を再利用しつつ、新しい要素を作成する際に大変便利です。なお、サンプルコードで利用されているDom\DocumentはPHP 8.2以降で導入された新しいDOM拡張の一部であり、実行環境によっては動作しない場合がありますのでご注意ください。