Me gustaría hacer una lista en Cargo Collective y hacer que se clasifiquen automáticamente en orden alfabético por el primer carácter. Ahora tengo dos versiones de código JavaScript, pero no pueden incluir mayúsculas y minúsculas al mismo tiempo.
html es así:
dos versiones de javascript:
el primero
<script type="text/javascript"> $("li").sort(function(a, b) { var aText = $(a).text(), bText = $(b).text(); return aText < bText ? -1 : aText > bText ? 1 : 0;}).appendTo('ul'); </script>el segundo
<script type="text/javascript"> var list = document.getElementById('mylist'); var items = list.childNodes; var itemsArr = []; for (var i in items) { if (items[i].nodeType == 1) { // get rid of the whitespace text nodes itemsArr.push(items[i]); } } itemsArr.sort(function(a, b) { return a.innerHTML == b.innerHTML ? 0 : (a.innerHTML > b.innerHTML ? 1 : -1); }); for (i = 0; i < itemsArr.length; ++i) { list.appendChild(itemsArr[i]); } </script>Cómo hacer que las palabras en minúsculas de abajo también estén en la lista, sin separarlas...
¡¡¡Gracias!!!
En la segunda secuencia de comandos, aplique toUpperCase() a ambos textos antes de compararlos o, un poco más elegante, podría usar el argumento de options del método localeCompare :
var list = document.getElementById('mylist'); var itemsArr = Array.from(list.children) .filter(li => li.textContent.trim()); // Only non-empty itemsArr.sort(function(a, b) { return a.textContent.localeCompare(b.textContent, "en", { sensitivity: "base" }); }); // Optionally remove items first? (So empty items are gone?) list.innerHTML = ""; for (let item of itemsArr) { list.appendChild(item); } <ul id="mylist"> <li></li> <li></li> <li></li> <li>apple Juice</li> <li>water</li> <li>lemon</li> <li>Icetea</li> <li>cola</li> <li>Tonic</li> <li></li> </ul>