Question

在一个item数组中，我试图在循环的帮助下推送row（bootstrap类）并设置col-sm-6类（行类的子类，也来自bootstrap类）。

items.push('<div class="row display-flex">');

$.each(obj, function(i,val){           
        items.push('<div class="col-sm-6 col-md-4 col-lg-3 display-flex"> \
                        <div class="thumbnail"> \
                            <div class="caption"> \
                                <h3 class="h3-margin-top-change">'+val.rm_name+'</h3> \
                            </div> \
                        </div> \
                        </div> \
                    </div> ');
}); 

items.push('</div>');

但div是自动关闭

<div class="row display-flex"></div>
<div class="col-sm-6 col-md-4 col-lg-3 display-flex">
...
</div>

导致col标签无组织。预期的答案是

<div class="row display-flex">
     <div class="col-sm-6 col-md-4 col-lg-3 display-flex">
     ...
     </div>
</div>

Answer 1

如果没有封闭，浏览器会对大多数元素进行自我封闭。在追加items数组之前，请加入元素。

$(element).html(items.join(''))

.jush在javascript中自动关闭div标签

1 个答案: