D3将多个子代添加到同一父代

Question

如何将多个子元素添加到父元素？

这是我想要实现的目标：

<div id = "myDiv">
    <div id = "child1"></div>
    <div id = "child2"></div>
</div>

但是，这会使child2成为child1的孩子：

$("#myDiv").append("div").attr("id", "child1").append("div").attr("id","child2")

是否可以使用点表示法添加具有不同属性的两个子代？

编辑：怎么样也将一个孩子追加到child1？

Answer 1

$("#myDiv").append("<div id='child1'>").append("<div id='child2'>")

Answer 2

还有一个

$('#myDiv').append($('<div>', { id: 'child1' })).append($('<div>', { id: 'child2' }))

Answer 3

$("#myDiv").append("div").attr("id", "child1").append("div").attr("id","child2");

将“ div”文本追加到myDiv，然后将以前称为“ myDiv”的div 的id属性更改为“ child1”，然后追加更多文本并再次更改id。

更改报表形式：

$("<div>").attr("id", "child3").add($("<div>").attr("id", "child4")).appendTo("#myDiv");

这样，jQuery创建了一个格式正确的div，为其分配了id和id属性，然后添加了另一个带有id的div。 请注意，由于.add()的第二次加法是正确的，这是由于其中的$和在将其添加到第一个之前添加的id属性，然后它们都被追加了。

注意：您也可以使用上面的模式，或为child1的孩子做简单的字符串，如下所示：

$("<div id='child1A'/><div id='child1B'/>").appendTo("#child1");

值得一提的是，此操作仅会击中所需的DOM一次，您也可以构建字符串以附加更多内容-仍仅使用该附加项击中DOM一次。

Answer 4

• 你可以clone() #myDiv给一个变量，环高达需要的子元素的数量，更改属性，然后appendTo #myDiv 。 我知道，有点复杂。
• 也许最好使用两次append 。 （在两行中，没有链接）

• 哦，等等，您可以使用add （这是一个小提琴： http : //jsfiddle.net/w4qnk/ ）

    $elemts = $() $elemts = $elemts.add($('<div/>', { 'id': 'child1'})) $elemts = $elemts.add($('<div/>', { 'id': 'child2'})) $("#myDiv").append($elemts)