指定要素の全ての子要素除去後、子要素リスト末尾へ指定要素追加

DOM

概要

　閲覧数:611 　投稿日:2016-11-08 　更新日:2017-05-09 　

指定要素の全ての子要素除去後、子要素リスト末尾へ指定要素追加
・appendChildする度に追加されていくことを防ぐ

コード

<div id="stage"></div>

<script>
  var elem = document.getElementById('stage');
  while (elem.firstChild) {
    elem.removeChild(elem.firstChild);
  }
  elem.appendChild(targetElem);
</script>

<!-- 順番は重要。<script>タグの後に、<div id="stage"></div>を記述するとエラー発生 -->


タグ


firstChild　 removeChild　


リンク


Node.removeChild


HTMLからタイトルを取得

CSSメディアクエリと同じように、スクリーンサイズ毎にJavaScriptで条件分岐



類似度ページランキング
順位 ページタイトル抜粋 ％
1 指定要素の全ての子要素除去後、子要素リスト末尾へ指定要素追加 67
2 配列生成後、全ての中身を順番に、別の関数へ引数として渡す 21
3 オブジェクトの要素数を数える 18
4 配列の要素を「数値の降順」にソート 17
5 配列内の要素を、長さの少ない順に並べ替え 16
6 オブジェクトのキーとして、変数の値を使用 16
7 クリックした要素のid名を取得 ／ クリックした要素のクラス名を取得 16
8 検索文字列を使用して文字列内のテキストを置換 15
9 文字列を、指定した区切り文字で分割し、配列へ格納 15
10 クリックした要素を取得 15
11 json 文字列を eval 関数(セキュリティリスクあり)を使ってオブジェクトへ変換 14
12 文字列内のテキストを正規表現で置換。その際、エスケープ使用 14
13 文字列から「指定文字列」を削除 13
14 オブジェクトのキーとして、配列からランダムな値を取得して使用 13
15 オブジェクトを生成し、アクセス 13
16 現在日時を、dateオブジェクトとして取得 12
17 spilitで、指定した内容で分割できないときの戻り値は、["対象文字列"] 12
18 テーブルタグと内容を作成して追加 ／ for 12
19 配列をネストしたオブジェクトを生成し、アクセス 11
20 引数の既定値 11
2025/11/05 9:32 更新
週間人気ページランキング ／ 10-29 → 11-4
順位 ページタイトル抜粋 アクセス数
1 クリックした要素のid名を取得 ／ クリックした要素のクラス名を取得 | クリック(イベント) 5
2 オブジェクト内配列より、重複しない値を取得して、新たな配列を生成 | オブジェクト 1
2 spilit | タグ毎エントリー一覧 1
2 firstChild | タグ毎エントリー一覧 1
2 JavaScriptコード 1
2 json 文字列を JSON.parse() メソッド(推奨)を使ってオブジェクトへ変換 | JSON 1
2 ログイン 1
2 replace | タグ毎エントリー一覧 1
2 ゲストコメント一覧ページ 1
2 String | タグ毎エントリー一覧 1
2 RegExp | タグ毎エントリー一覧 1
2 算術演算子(演算子) カテゴリー 1
2 valueOf | タグ毎エントリー一覧 1
2 正規表現(テキスト処理) カテゴリー 1
2 三項演算子(演算子) カテゴリー 1
2025/11/5 1:02 更新