HTML dom 要素を追加または削除する

ドキュメント オブジェクト モデル (DOM) は、拡張可能なマークアップ言語を処理するために W3C 組織によって推奨されている標準プログラミング インターフェイスです。 Web ページでは、ページ (またはドキュメント) を構成するオブジェクトがツリー構造で構成されます。この章では、ドキュメント内のオブジェクトを表すために使用される標準モデルを DOM と呼びます。 HTML dom 要素を削除するチュートリアルです。今すぐ学習してください。

新しい HTML 要素の作成

HTML DOM に新しい要素を追加するには、まず要素 (要素ノード) を作成し、次にその要素を既存の要素に追加する必要があります。

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<script>
var para=document.createElement("p");
var node=document.createTextNode("这是一个新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
element.appendChild(para);
</script>

このコードは新しい e388a4556c0f65e1904146cc1a846bee 要素を作成します:

var para=document.createElement("p");

e388a4556c0f65e1904146cc1a846bee 要素にテキストを追加するには、まずテキスト ノードを作成する必要があります。このコードはテキスト ノードを作成します:

var node=document.createTextNode("这是一个新段落。");

次に、テキスト ノードを e388a4556c0f65e1904146cc1a846bee 要素に追加する必要があります:

para.appendChild(node);

最後に、新しい要素を既存の要素に追加する必要があります。

このコードは既存の要素を検索します:

var element=document.getElementById("div1");

次のコードは既存の要素の後に新しい要素を追加します:

element.appendChild(para);

既存のHTML要素を削除します

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>

親要素を参照せずに実行できる場合要素を削除すると便利です。
でも残念です。 DOM は、削除する必要がある要素とその親要素を認識している必要があります。

これは一般的な解決策です: 削除したい子要素を見つけて、そのparentNode属性を使用して親要素を見つけます:

var child=document.getElementById("p1");
child.parentNode.removeChild(child);

上記はHTML dom要素の追加または削除に関する関連チュートリアルです。できることを願っていますみんなを助けて。

関連する推奨事項:

DOM を使用してイベントを割り当てる方法

DOM ノードの削除における空と削除の違い

jQuery で DOM を操作する方法

以上がHTML dom 要素を追加または削除するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。