Creé un div con Javascript, esto se muestra correctamente, sin embargo, no está en el lugar donde quiero, me gustaría ponerlo dentro de un contenedor como primer elemento. No soy muy bueno, estoy tratando de aprender, así que perdón por la trivialidad de la pregunta.
¿Cómo coloco el div que creé dentro de un contenedor ya existente como primer elemento?
Más allá de eso, me gustaría entender la lógica de la operación, por ejemplo, ¿cómo puedo mover el nuevo div como último elemento? ¿O como segundo elemento?
Este es el código 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);Esto es lo que estoy tratando de lograr
<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>Esto es lo que tengo por ahora
<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>const parent; const newFirstChild; parent.insertBefore(newFirstChild, parent.firstChild);En tu caso:
element.insertBefore(newEl, element.firstChild)Si desea insertar en un índice diferente, puede hacerlo así:
parent.insertBefore(newEl, parent.children[2])Esto debería funcionar:
element.insertBefore(newEl, element.firstChild)