如何控制动态添加的元素的位置？

[韦翔罂]

如何控制动态添加的元素的位置，例如，
<div id="container">
<input type="text" value="第一个文本框"></input>
<input type="text" value="第二个文本框"></input>
</div>

newInput = document.createElement('input');
newInput.type="text";
newInput.value ="第三个文本框";
document.getElementById("container").appendChild(newInput);//这里添加的第三个文本框元素将会出现在第二个文本框的后面，而我想让它出现在第一个文本框的前面，该如何实现？（希望不是用document.getElementById("container").innerHTML=···，因为这种方法当内容少的时候可以，但内容多时就会消耗很多资源啦。）

[sohighthesky]

document.getElementById("container").insertBefore(newInput,document.getElementById("container").children[0]/*插入到第一个子元素的前面*/);

[Click_Me]

document.getElementById("container").children[0]
===>document.getElementById("container").childNodes[0]

[sohighthesky]

[Quote=引用 2 楼 click_me 的回复:]
JScript code
document.getElementById("container").children[0]===>document.getElementById("container").childNodes[0]
[/Quote]
childNodes[0]表示第一个子节点，children[0]表示第一个子元素（不包含文本节点）