javascript - 如何在 Javascript 中将节点附加到 div 的开头？

Question

我目前正在将一个节点附加到 div 的末尾以动态添加到 div，但我希望将其附加到 div 的开头而不是结尾。

我当前的代码如下所示：

var para=document.createElement('div');

var node=document.createTextNode('this is new');
para.appendChild(node);

var element=document.getElementById("div1");
element.appendChild(para);


<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>

如何附加到 div 的开头？

Answer 1

您可以使用insertBefore()与父母的firstChild作为参考元素：

var element = document.getElementById("div1");
element.insertBefore(para, element.firstChild);

Answer 2

看看 jQuery ( http://www.jquery.com )，因为它会让你的生活变得更轻松。存在其他库，但 jQuery 是最流行的。

你的 jQuery 代码：

$("<div/>").append("this is new").appendTo($("#div1"))

并预先准备：

$("<div/>").prepend("this is new").prependTo($("#div1"))

Answer 3

element.insertBefore(para, element.firstChild )

https://developer.mozilla.org/en-US/docs/DOM/Node.insertBefore?redirectlocale=en-US&redirectslug=DOM%2Felement.insertBefore

Answer 4

我不确定，但你可以这样做：

<script type="text/javascript">
window.onload=function(){
dv=document.createElement('div1');
txt=document.createTextNode('this is new');
dv.appendChild(txt);
document.getElementById('div1').appendChild(dv);
}
</script>

Answer 5

您可以使用 javascript insertBefore() 方法。当您添加到 dom 时。