dポイントプレゼントキャンペーン実施中！

おしえて

Javascript 要素の作成と追加について

解決済

  • 質問者：Hypnomatic
  • 質問日時：
  • 回答数：2件

下記のようなHTML構造において、それぞれのdivの子要素にボタンを追加したいとします

<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</body>

そこで、下記のようなjavascriptをブラウザのコンソールで実行したところ、最後のdivにしかボタンが追加されませんでしたが、何故ですか？

btn = document.createElement("input");
btn.setAttribute("type","button");
btn.value = "ボタン";

document.querySelectorAll("div").forEach( elm =>{
elm.appendChild(btn);
})

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (2件)

No.2ベストアンサー

  • 回答者： tknakamuri
  • 回答日時：

appendChildはノードの親を切り換えるだけなので


btnを次々に引っ越しさせることになってます(^-^;
ループ内でボタンを都度作って下さい。
    • good
    • 1
    • 件
通報する
この回答へのお礼

ありがとうございます！

通報する
お礼日時：2021/11/14 22:12

No.1

elm.appendChild (btn.cloneNode (true));

    • good
    • 2
    • 件
通報する
この回答へのお礼

ありがとうございます

通報する
お礼日時：2021/11/14 22:13

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報