我有一个使用
当我使用HTML时,Bootstrap正常工作。
当我使用javascript创建它时,按钮失去了填充。
我希望两种代码的结果相同。
为什么动态创建的代码不能保留HTML创建的原始水平间距?
有谁能帮助我解决这个问题?
这里是JsFiddle代码: JsFiddle 谢谢您的帮助。
well
类的Bootstrap按钮栏,我的代码中重复出现了两次:一次是使用HTML代码创建的,另一次是使用动态javascript创建的。当我使用HTML时,Bootstrap正常工作。
当我使用javascript创建它时,按钮失去了填充。
我希望两种代码的结果相同。
为什么动态创建的代码不能保留HTML创建的原始水平间距?
有谁能帮助我解决这个问题?
Original code:
<div class="well">
<button type="button" class="btn btn-primary btn-xs">Button 1</button>
<button type="button" class="btn btn-primary btn-xs">Button 2</button>
<button type="button" class="btn btn-primary btn-xs">Button 3</button>
<small class="pull-right">Right Text</small>
</div>
<div id="myMenu">
</div>
<script type="text/javascript">
$(document).ready(function () {
var upperWell = $("<div class='well clearfix'>");
$('#myMenu').append(upperWell);
var createButton = $("<button type='button' class='btn btn-primary btn-xs'>Button1</button>");
var updateButton = $("<button type='button' class='btn btn-primary btn-xs'>Button 2</button>");
var exportButton = $("<button type='button' class='btn btn-primary btn-xs'>Button 3</button>");
$(upperWell).append(createButton);
$(upperWell).append(updateButton);
$(upperWell).append(exportButton);
});
</script>
这里是JsFiddle代码: JsFiddle 谢谢您的帮助。
<li><a...</li>
动态生成的HTML没有空格,但是这段代码被插入的原始HTML由于缩进而有空格。通过在JS中在li
前后添加一个空格来解决这个问题。 - Dylan Valade