如何.append（）一个对象

Question

我正在用javascript制作一个简单的游戏，我想.append()一个盒子。充当子弹。但我被卡住了。这就是我所拥有的

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

和

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

当我按下“#test”按钮时，它不会创建额外的“div”。

Answer 1

你必须选择现有的div（我猜这是子弹？）。然后追加它。

以下是示例： Working Demo

<强>使用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（）方法将其删除。

Answer 2

我相信你想在现有div中添加一个新的div，所以你的代码已经颠倒了追加顺序。你需要用$('#bullet')包裹现有的div 试试这个

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

Answer 3

来自.append documentation：

  

如果以这种方式选择的元素被插入到DOM中其他位置的单个位置，它将被移动到目标中（未克隆）。

好像你首先想要clone ^[docs]元素：

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

请注意，如果您的网页上有多个div元素，$("div")会选择所有这些元素，并且您传递给.append的元素会自动克隆（如文档中所述） ）。
您应该仅将元素附加到单个div。

Answer 4

您可以使用.clone()

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