¿Cómo creo nuevos elementos y los ordeno por números desde "número de datos"? ¿Alguna idea de cómo hacerlo? Encontré un método de clasificación con, pero ¿cómo insertarlo en el bucle?
El resultado en "clasificación de padres" debería verse así:
<div id="parent-sort"> <div class="child" id="child2" data-name="1">1</div> <div class="child" id="child4" data-name="2">2</div> <div class="child" id="child1" data-name="3">3</div> <div class="child" id="child3" data-name="4">4</div> </div>Código:
function myFunction() { elementsort = document.getElementById("parent").children; for (i = 0; i < elementsort.length; i++) { var element_id = elementsort[i].id; var element_class_name = elementsort[i].className; var element_inner_html = elementsort[i].innerHTML; var data_name = elementsort[i].getAttribute("data-name"); const new_div = document.createElement("div"); new_div.id = element_id; new_div.className = element_class_name; new_div.innerText = element_inner_html; new_div.setAttribute("data-name", data_name); document.getElementById("parent-sort").appendChild(new_div); } } <div id="parent"> <div class="child" id="child1" data-name="3">3</div> <div class="child" id="child2" data-name="1">1</div> <div class="child" id="child3" data-name="4">4</div> <div class="child" id="child4" data-name="2">2</div> </div> <div id="parent-sort"> </div> <button onclick="myFunction()">Click me</button>Puedes usar el siguiente código:
function myFunction() { elementsort = document.getElementById("parent").children; const sortedList = [...elementsort].sort((a, b) => { const c = a.textContent, d = b.textContent; return c < d ? -1 : c > d ? 1 : 0; }); for (const item of sortedList) { document.getElementById("parent-sort").appendChild(item); } } <div id="parent"> <div class="child" id="child1" data-name="3">3</div> <div class="child" id="child2" data-name="1">1</div> <div class="child" id="child3" data-name="4">4</div> <div class="child" id="child4" data-name="2">2</div> </div> <div id="parent-sort"> </div> <button onclick="myFunction()">Click me</button>