的JavaScript创建的标签插入错误的位置

Question

所以我有以下的HTML：

<div id="divForComponents"> 
     <input type="button" value="+" onclick="addFilter('divForComponents')"/>         
</div> 

在我的脚本文件：

function addFilter(divId){ 
var div = document.getElementById(divId); 

var label = document.createElement("label"); 
var text = document.createTextNode("Filter by:"); 
label.appendChild(text); 
div.appendChild(label); 

var filter = document.createElement("select"); 
filter.name = "selectName"; 
filter.options[0] = new Option("selection 1","value 1"); 
filter.options[1] = new Option("selection 2","value 2"); 
filter.options[2] = new Option("selection 3","value 3"); 
filter.options[3] = new Option("selection 4","value 4"); 
div.appendChild(filter); 

var input = document.createElement("input"); 
input.type = "text"; 
input.name = "inputName"; 
div.appendChild(input); 
} 

现在选择成分和输入字段正确添加，但该标签添加在我已经在该div上的按钮之前。我想，并期望获得定位：

Button Label Select Input 

相反，我得到：

Label Button Select Input 

我测试的浏览器是铬，不知道这算个什么在这里。

问候， 波格丹

Answer 1

它实际上是插入标签按钮之前或只是视觉上显示出来呀？这听起来像你可能有一个CSS样式，告诉标签向左浮动。

Answer 2

首先，你的功能被命名为addComponents()，但你使用addFilter()。我刚刚尝试过您的代码，并将addFilter()更改为addComponents()，并且标签已正确设置。

Answer 3

正常工作时在Chrome中的功能是否正确命名为：

http://jsfiddle.net/AlienWebguy/bVzwr/