javascript - 如何使用 JavaScript 在容器中插入 div 作为第一个元素

Question

我用 Javascript 创建了一个 div，它可以正确显示，但是它不在我想要的位置，我想把它放在一个容器中作为第一个元素。我不是很好，我正在努力学习，非常抱歉问题的琐碎。

如何将我创建的 div 作为第一个元素放入已经存在的容器中？

除此之外，我想了解一下操作的逻辑，例如，如何将新的 div 作为最后一个元素移动？还是作为第二个元素？

这是Js代码

// Add New Element
var newEl = document.createElement("div");
var text = document.createTextNode("Hello");
   newEl.appendChild(text);
   var element = document.getElementById("main_container");
   element.appendChild(newEl);

这就是我想要实现的目标

<div id="main_container" class="something">
   <div class="new_element">Hello</div>
   <div class="item">One</div>
   <div class="item">Two</div>
   <div class="item">Three</div>
</div>

这就是我现在得到的

<div id="main_container" class="something">
   <div class="item">One</div>
   <div class="item">Two</div>
   <div class="item">Three</div>
</div>
<div>Hello</div>

Answer 1

这应该可行:

element.insertBefore(newEl, element.firstChild)