jquery - 将多个对象添加到自关闭 div

Question

我正在尝试向一个 div 添加多个对象。

代码

            var button1 = $('<button/>',{
                type: "button",
                class: "btn btn-defaultl btn-sm",
                html: span1
            });

            var button2 = $('<button/>',{   
                type: "button",
                class: "btn btn-defaultl btn-sm",
                html: span2
            });

            var h3 = $('<h3/>',{
                text: value.name
            })

            var inner_div = $('<div/>',{
                class: 'col-xs-8',
                html: h3.append(button1).append(button2)

            });

请原谅我的命名，这将被更改

目标 我想要一个这样的结构

<div class="col-xs-8">
   <h3></h3>
   <button1 ... />
   <button2 ... />
</div>

但是代码现在将所有内容都放在彼此内部

<div class="col-xs-8">
   <h3>
        <button1 ... />
        <button2 ... />
    </h3>
</div>

我应该使用哪个 jquery 函数？

Answer 1

您可以使用 .append()将这些元素直接添加到 div 中，例如

var inner_div = $('<div/>', {
    class: 'col-xs-8'
}).append(h3).append(button1).append(button2);

在您的情况下，您要添加 button元素是 h3 的子元素然后添加 h3作为 div 的 child