ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript_javascript スキルでの appendChild、insertBefore、insertAfter の使用手順

JavaScript_javascript スキルでの appendChild、insertBefore、insertAfter の使用手順

WBOY
リリース: 2016-05-16 18:12:59
オリジナル
1326 人が閲覧しました

appendChild 定義
appendChild(newChild: Node): ノード
ノードの childNodes 配列にノードを追加します。
サポート: IE 5.0、Mozilla 1.0、Netscape 6.0、 Safari 1.0、Opera 7.0
指定したノードの子ノード配列にノードを追加する 簡単に言うと、
appendChild に要素を追加するということです。使用法
target.appendChild(newChild)
newChild は最後の子ノードの後に​​ターゲットの子ノードとして挿入されます
appendChild の例

コードをコピーします コードは次のとおりです。

var newElement = document.Document.createElement('label'); .Element.setAttribute('value ', 'Username:');
var usernameText = document.Document.getElementById('username');


insertBefore 定義
insertBefore() メソッドは、既存の子ノードの前に新しい子ノードを挿入します。ターゲットの子ノードとして、existingChild ノードの前に挿入されますexistingChild は、null の場合、その効果は appendChild


insertBefore example


コードをコピーします

コードは次のとおりです。



コードをコピーします

コードは次のとおりです。


function insertAfter(newEl, targetEl)
{
varparentEl = targetEl.parentNode ;
if(parentEl.lastChild == targetEl) { parentEl.appendChild(newEl); }else { parentEl.insertBefore(newEl,targetEl.nextSibling); 🎜>} }


使用法と例の後で挿入





コードをコピー


コードは次のとおりです:

var txtName = document.getElementById("txtName"); var htmlSpan = document.createElement("span"); = " これはテストです";
insertAfter(htmlSpan,txtName);
txtName ノードの後に​​ htmlSpan を兄弟ノードとして挿入します 概要: 1. appendChild と insertBefore はノードをペアリングするためのメソッドとして使用されますが、insertAfter は単なるカスタム関数 2. appendChild と比較して、insertBefore はより柔軟で、ターゲット ノードの任意のノード配列に新しいノードを挿入できます。 3. appendChild と insertBefore を使用して新しいノードを挿入します。前提条件として、その兄弟ノードには共通の親ノードが必要です。
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート