Question

我需要你的帮助才能解决我遇到的问题。我有这段代码：

<div id="div1" >
    <div id="edit1">
       hello
       <input type="button" id="b1" onclick="aaa()"/>
    </div>
</div>

我想使用insert到内部div（id = edit1）我生成的另一个新div。

我尝试了相似的代码，但它没有运行：

js:
function aaa()
{
   var elem = createDivLine();
   var el1 = document.getElementById("div1");
   var el2 = el1.getElementById("edit1");
   el2.appendChild(elem);
}

function createDivLine()
{
   var tempDiv1 = document.createElement("div");
   tempDiv1.innerHTML = "Sam";
   return tempDiv1;
}

结果应如下所示：

<div id="div1" >
    <div id="edit1">
       hello
       <input type="button" id="b1" onclick="createDivTable()"/>
       <div>"Sam"</div>
    </div>
</div>

JSFiddle：http://jsfiddle.net/KknXF/

Answer 1

由于ID是唯一的，因此尝试按ID获取元素的子项无效。

删除此行：

var el1 = document.getElementById('div1');

并将以下行更改为：

var el2 = document.getElementById('edit1');

如果你有一些不可思议的（我永远不会拼写那个词......）破坏了你无法改变的HTML，试试这个：

var el2 = document.querySelector("#div1 #edit1");

Answer 2

应该是

function aaa() {
   var elem = createDivLine();
   var el2 = document.getElementById("edit1");
   el2.appendChild(elem);
}

演示：Fiddle

无法将div插入另一个内部div

2 个答案: