Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

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

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

作成日: 更新日:

基本的な使い方

removeChildメソッドは、DOM (Document Object Model) において、指定された子ノードを親ノードから削除するメソッドです。Dom\Elementクラスに所属しており、Elementオブジェクト(要素ノード)から呼び出すことで、その要素ノードの子ノードを削除します。

このメソッドは、ノードツリー構造を操作する上で非常に重要です。removeChildメソッドを使用することで、不要になった要素をDOMツリーから取り除くことができ、動的なコンテンツの更新や構造変更を実現できます。removeChildメソッドは引数として削除したい子ノードを受け取ります。削除が成功すると、removeChildメソッドは削除されたノードを返します。もし指定されたノードが子ノードでない場合、例外が発生します。

removeChildメソッドは、Webページの表示内容をJavaScriptなどのスクリプト言語から操作する際に頻繁に使用されます。例えば、ユーザーの操作に応じて特定の要素を削除したり、動的に生成された要素を削除したりする際に役立ちます。removeChildメソッドを使用することで、Webページのインタラクティブ性を高め、より柔軟なコンテンツ表示を可能にします。また、removeChildメソッドを使用する際には、削除するノードが存在することを確認し、予期せぬエラーが発生しないように注意する必要があります。removeChildメソッドは、DOM操作における基本的なメソッドの一つであり、Web開発者にとって必須の知識と言えるでしょう。

構文(syntax)

1Dom\Element::removeChild(Dom\Node $oldChild): Dom\Node|false

引数(parameters)

Dom\Node $child

  • Dom\Node $child: 削除したい子ノードを指定します。

戻り値(return)

Dom\Node

指定された要素(Dom\Element)から、引数で指定された子ノード(Dom\Node)を削除し、削除された子ノードそのものを返します。

サンプルコード

PHP DOM removeChildで要素を削除する

1<?php
2
3declare(strict_types=1);
4
5/**
6 * Dom\Element::removeChild の使用例を示す関数です。
7 * HTMLリストから特定のアイテムを削除し、その前後を出力します。
8 */
9function demonstrateDomRemoveChild(): void
10{
11    // 操作対象となるHTML文字列を定義します。
12    $html = <<<HTML
13    <!DOCTYPE html>
14    <html lang="ja">
15    <head>
16        <meta charset="UTF-8">
17        <title>removeChild Example</title>
18    </head>
19    <body>
20        <ul id="itemList">
21            <li id="item1">アイテム1</li>
22            <li id="item2">アイテム2(この要素を削除します)</li>
23            <li id="item3">アイテム3</li>
24        </ul>
25    </body>
26    </html>
27    HTML;
28
29    // DOMDocument オブジェクトを生成し、HTMLを読み込みます。
30    $dom = new \DOMDocument();
31
32    // HTMLのパース時に発生する警告などを抑制します。
33    libxml_use_internal_errors(true);
34    $dom->loadHTML($html);
35    libxml_clear_errors();
36
37    // 親要素 (ul#itemList) を取得します。
38    // getElementById は DOMElement または null を返します。
39    $list = $dom->getElementById('itemList');
40
41    // 削除対象の子要素 (li#item2) を取得します。
42    $itemToRemove = $dom->getElementById('item2');
43
44    // 親要素と削除対象の子要素が両方見つかった場合に処理を実行します。
45    if ($list instanceof \DOMElement && $itemToRemove instanceof \DOMElement) {
46        echo "--- 削除前のリスト ---" . PHP_EOL;
47        // saveHTMLにノードを渡すと、そのノード以下のHTMLを取得できます。
48        echo $dom->saveHTML($list);
49        echo PHP_EOL;
50
51        // 親要素から指定した子要素を削除します。
52        // removeChildメソッドは、削除されたノード自体を返り値として返します。
53        $removedNode = $list->removeChild($itemToRemove);
54
55        echo "--- 削除後のリスト ---" . PHP_EOL;
56        echo $dom->saveHTML($list);
57        echo PHP_EOL;
58
59        echo "--- 削除されたノードの情報 ---" . PHP_EOL;
60        // 戻り値(削除されたノード)のテキスト内容を確認します。
61        echo "ノード名: {$removedNode->nodeName}, テキスト: {$removedNode->textContent}" . PHP_EOL;
62    }
63}
64
65// 作成した関数を実行します。
66demonstrateDomRemoveChild();

このPHPコードは、HTMLドキュメントの特定の要素から子要素を削除する Dom\Element::removeChild メソッドの使い方を示したサンプルです。

まず、DOMDocument クラスを利用してHTML文字列をプログラムで操作可能なオブジェクトに変換します。次に getElementById を使って、親要素であるリスト(<ul id="itemList">)と、その中から削除したい子要素(<li id="item2">)をそれぞれ取得しています。

removeChild メソッドは、親要素のオブジェクトから呼び出します。引数には、削除したい子要素のオブジェクトを渡すことで、その子要素を親要素から取り除きます。サンプルコードでは、このメソッドを実行する前と後でリストのHTMLを出力し、指定したアイテムが削除されていることを視覚的に確認できます。

このメソッドの重要な特徴は、戻り値として「削除されたノード(要素)そのもの」を返す点です。コードの最後では、この戻り値を受け取り、そのテキスト内容を表示することで、意図した通りの要素が削除されたことを検証しています。このように removeChild を使うことで、PHPプログラムから動的にHTMLの構造を変更することが可能です。

removeChildメソッドを使う際は、削除するノードが呼び出し元要素の直接の子である必要があります。孫要素などを指定するとエラーが発生するため注意が必要です。また、getElementByIdは対象が見つからない場合にnullを返すため、サンプルコードのようにif文で要素の存在を確認してからremoveChildを呼び出すのが安全な記述です。このメソッドは削除したノードを戻り値として返すので、単に消すだけでなく、別の要素へ移動させたい場合にも活用できます。なお、getElementByIdが正しく機能するためには、HTMLに<!DOCTYPE>宣言が含まれていることが重要です。

関連コンテンツ

関連プログラミング言語

【PHP8.x】Dom\Element::removeChild()メソッドの使い方 | いっしー@Webエンジニア