Trier un ensemble de balises li alphanumériques

Question

J'ai joué en essayant d'obtenir une fonction qui va trier une sélection de balises li par leur contenu, mais actuellement en vain (au moins pas de vitesse/précision); Il est à la fois lent et pas génial au moment du tri. Idéallement, il trierait en fonction du contenu d'une balise forte qui réside dans le li.

est ici la fonction alphaNumSort si vous êtes intéressé (cela fonctionne un régal est juste le html merdique et des déchets de clonage qui est pas vraiment travailler)

function alphaNumSort(m,n){ 
try{ 
    var cnt= 0,tem; 
    var a= m.toLowerCase(); 
    var b= n.toLowerCase(); 
    if(a== b) return 0; 
    var x=/^(\.)?\d/; 

    var L= Math.min(a.length,b.length)+ 1; 
    while(cnt< L && a.charAt(cnt)=== b.charAt(cnt) && 
    x.test(b.substring(cnt))== false && x.test(a.substring(cnt))== false) cnt++; 
    a= a.substring(cnt); 
    b= b.substring(cnt); 

    if(x.test(a) || x.test(b)){ 
     if(x.test(a)== false)return (a)? 1: -1; 
     else if(x.test(b)== false)return (b)? -1: 1; 
     else{ 
      var tem= parseFloat(a)-parseFloat(b); 
      if(tem!= 0) return tem; 
      else tem= a.search(/[^\.\d]/); 
      if(tem== -1) tem= b.search(/[^\.\d]/); 
      a= a.substring(tem); 
      b= b.substring(tem); 
     } 
    } 
    if(a== b) return 0; 
    else return (a >b)? 1: -1; 
} 
catch(er){ 
    return 0; 
} 

}

Vive

Answer 1

Je ne suis pas complètement sûr de ce que fait votre fonction alphaNumSort, mais une simple comparaison de chaînes peut suffire.

var li = $('#licontainer li').get(); 

// sort the list items based on the contents of a nested strong tag 
li.sort(function(a, b) { 
    a = $('strong', a).text(); 
    b = $('strong', b).text(); 

    // you may want to process the text values further here, perhaps 
    // running it through $.trim, reducing whitespace sequences with 
    // a regular expression, or lower- or upper-casing letters to 
    // make the comparison case-insensitive. 

    return (a < b) ? -1 : ((a > b) ? 1 : 0); 
}); 

// reinsert the list items in their new order 
$('#licontainer').append(li); 

Cela devrait être considérablement plus rapide que votre méthode de liste temporaire, car elle effectue moins d'opérations DOM. L'utilisation de comparaisons de chaînes natives devrait également être un peu plus rapide que votre algorithme de tri actuel, mais si elle fait quelque chose de spécifique que j'ai manqué, mettez à jour l'instruction return pour l'utiliser (en gardant les lignes précédentes).

return alphaNumSort(a, b); 

Si cela est encore lent vous pourriez aussi susceptibles d'améliorer les performances encore plus en se cachant la liste avant de le manipuler, ce qui empêche le navigateur d'effectuer repaints inutiles.

var li = $('#licontainer').hide().find('li').get(); 

// ... 

$('#licontainer').append(li).show(); 

Answer 2

Si vous vouloir le trier avec javascript, vous avez besoin de a method/function to sort. Et vous devez choisir quand il sera trié: chargement, clic sur un bouton, etc ...

L'autre possibilité est de trier avant d'envoyer le code HTML: cela dépend de la langue de votre serveur. Php, java, asp, etc ...? Mais vous pouvez utiliser the same link pour trouver le meilleur algorithme pour vos besoins.

Answer 3

var sortList = function() { 
    var ul = document.getElementsByTagName("ul"), 
    ol = document.getElementsByTagName("ol"), 
    sort = function (x) { 
     var a, li; 
     for (a = 0; a < x.length; a += 1) { 
      li = x[a].getElementsByTagName("li"); 
      li = li.sort(); 
      x[a].innerHTML = li.join(""); 
     } 
    }; 
    sort(ul); 
    sort(ol); 
};