javascript - オブジェクトを .append() する方法

Question

私はjavascriptで簡単なゲームを作っていますが.append()、ボックスにしたいと思います。弾丸として機能します。しかし、私は立ち往生しています。これは私が持っているものです

var existingdiv1 = document.getElementById('bullet');

と

$("#test").click(function() {
    $("div").append([existingdiv1]); 
});

「#test」ボタンを押しても追加の「div」が作成されません。

score 1 · Accepted Answer

既存の div を選択する必要があります (これが箇条書きだと思いますか?)。次に、それを追加します。

ここに例があります： ワーキングデモ

Javascript:

$("#test").click(function(){
    $("#appendToThis").append($('#bullet').html()); 
});

HTML:

<input id="test" type="button" value="click" />
<div id="appendToThis"></div>

<div id="bullet"><div>BANG</div></div>

クリックするたびに「bang」という単語が追加されます。テスト div で empty() メソッドを使用して削除できます。

score 0 · Accepted Answer

.clone()を使用できます

$("#test").click(function(){
    $("#appendToThis").append($('#bullet').clone()); 
});

score 0 · Accepted Answer

既存の div に新しい div を追加したかったので、コードの追加順序が逆になっていると思います。$('#bullet') そして、これを試して既存のdivをラップする必要があります

$('#bullet').append('<div></div>');

score 0 · Accepted Answer

この方法で選択された要素が DOM の別の場所に挿入された場合、その要素はターゲットに移動されます (複製されません)。

^[docs]最初に要素を複製したいようです:

$("div").append($(existingdiv1).clone());
// or simpler
$("div").append($('#bullet').clone());

ただし、divページに複数の要素がある場合$("div")、はそれらすべてを選択し、渡す要素は.append自動的に複製されることに注意してください (ドキュメントに記載されているとおり)。
単一の div にのみ要素を追加する必要があります。

4 に答える 4