Ordenar filas de tablas según sus nombres de clase

Question

Quiero reorganizar las filas de la tabla en función de sus nombres de clase.
A continuación se muestra mi código HTML.

<table> 
<tr class="a4"><td>4</td></tr> 
<tr class="a6"><td>6</td></tr> 
<tr class="a1"><td>1</td></tr> 
<tr class="a2"><td>2</td></tr> 
<tr class="a5"><td>5</td></tr> 
<tr class="a3"><td>3</td></tr> 
</table> 

Así que ahora, con el nombre de la clase A1 debe mostrar primero, del mismo modo a2 segundos .. etc ..

Por favor, que alguien me ayude

Answer 1

I Si no desea confiar en un complemento externo, puede extraer los números de los nombres de clase usando match() y ordenar los elementos usando el método sort() incorporado.

A partir de ahí, se puede utilizar append() para reordenar las filas de la tabla (que eliminará cada fila de la tabla a continuación, volver a añadirlo en la posición correcta):

$("table").append($("tr").get().sort(function(a, b) { 
    return parseInt($(a).attr("class").match(/\d+/), 10) 
     - parseInt($(b).attr("class").match(/\d+/), 10); 
})); 

se puede ver el resultado en this fiddle .

Answer 2

Usted podría utilizar this plugin y a algo como:

jQuery.fn.sortElements = (function(){ 

    var sort = [].sort; 

    return function(comparator, getSortable) { 

     getSortable = getSortable || function(){return this;}; 

     var placements = this.map(function(){ 

      var sortElement = getSortable.call(this), 
       parentNode = sortElement.parentNode, 

       // Since the element itself will change position, we have 
       // to have some way of storing its original position in 
       // the DOM. The easiest way is to have a 'flag' node: 
       nextSibling = parentNode.insertBefore(
        document.createTextNode(''), 
        sortElement.nextSibling 
       ); 

      return function() { 

       if (parentNode === this) { 
        throw new Error(
         "You can't sort elements if any one is a descendant of another." 
        ); 
       } 

       // Insert before flag: 
       parentNode.insertBefore(this, nextSibling); 
       // Remove flag: 
       parentNode.removeChild(nextSibling); 

      }; 

     }); 

     return sort.call(this, comparator).each(function(i){ 
      placements[i].call(getSortable.call(this)); 
     }); 

    }; 

})(); 
// do the sorting 
$('tr').sortElements(function(a, b){ 
    return $(a).attr('class') > $(b).attr('class') ? 1 : -1; 
}); 

violín aquí: http://jsfiddle.net/ZV5yc/1/