javascript - 使用 javascript jquery 失去利润

Question

为什么当我使用 javascript jquery 添加相同的 html 代码时，我会失去边距？
试试这个 jsfiddle你会理解我的。

jQuery

 function addphone() {
$( "#phonedetails" ).append( '<div  >' +
    '<label>phone :</label>' +
    '<input type="text" /> '   +  
    '<input type="button" onclick="addphone()"/>'    +                       
    '</div>');  

 }

HTML

<div id="phonedetails">
    <div>
        <label>phone :</label>
        <input type="text" />     
        <input type="button" onclick="addphone();"/>
    </div>
</div>

Answer 1

它不是边距，而是 label 和 input 之间的空格(即按空格键时得到的内容)。 JS 生成的代码中缺少它。

更改:

'<label>phone :</label>' +

致:

'<label>phone :</label> ' +
                  //   ^ space here