Las etiquetas pueden tener varios atributos. El orden en el que los atributos aparecen en el código no importa. Por ejemplo:
<a href="#" title="#">
<a title="#" href="#">
¿Cómo puedo "normalizar" el HTML en Javascript, por lo que el orden de los atributos es siempre el mismo? No me importa en que orden es elegido, el tiempo es siempre el mismo.
ACTUALIZACIÓN: mi meta original era hacer más fácil el diff (en JavaScript) 2 páginas HTML con ligeras diferencias. Debido a que los usuarios pueden utilizar diferentes programas para modificar el código, la orden de los atributos podrían cambiar. Esto hace que el diff demasiado detallado.
RESPUESTA: Bueno, primero gracias por todas las respuestas. Y SÍ, es posible. Aquí es cómo me las he arreglado para hacerlo. Esta es una prueba de concepto, que sin duda puede ser optimizado:
function sort_attributes(a, b) {
if( a.name == b.name) {
return 0;
}
return (a.name < b.name) ? -1 : 1;
}
$("#original").find('*').each(function() {
if (this.attributes.length > 1) {
var attributes = this.attributes;
var list = [];
for(var i =0; i < attributes.length; i++) {
list.push(attributes[i]);
}
list.sort(sort_attributes);
for(var i = 0; i < list.length; i++) {
this.removeAttribute(list[i].name, list[i].value);
}
for(var i = 0; i < list.length; i++) {
this.setAttribute(list[i].name, list[i].value);
}
}
});
Lo mismo para el segundo elemento de la diferencia, $('#different')
. Ahora, $('#original').html()
y $('#different').html()
mostrar código HTML con atributos en el mismo orden.