JSFiddle - React, Tailwind, and code Playground

Ordenar un NodeList de LIs

by Juan Antonio Jiménez Torres

HTML

<ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
    <li>E</li>
</ul>
<button>Cambiar orden</button>

JavaScript

var isAsc = true;

function compare(a,b){
	if (a.textContent < b.textContent) {
  	return -1;
  } else if (a.textContent > b.textContent) {
    return 1;
  } else {
  	return 0;
  }
}

function soort(){
	var nodeList = document.querySelectorAll("li");
  var arrayLIs = Array.prototype.slice.call(nodeList);
  var objUL = document.querySelector("ul");
	if (!isAsc){
  	arrayLIs = arrayLIs.sort(compare);
    isAsc = true;
  } else {
  	arrayLIs = arrayLIs.reverse();
    isAsc = false;
  }
	objUL.innerHTML = "";
  for (var i = 0; i < arrayLIs.length; i++) {
    objUL.appendChild(arrayLIs[i]);
	}
}

var button = document.querySelector("button");
button.addEventListener("click", function(){
	sort();
})