¿Existe un método preferido para determinar si a un elemento se le asigna una clase, desde el punto de vista del rendimiento?
$('#foo').hasClass('bar');
o
$('#foo').is('.bar');
Comprometí una prueba después de un comentario y cuatro votos a favor para comentar. Resulta que lo que había dicho es la respuesta correcta. Aquí está el resultado:
http://jsperf.com/hasclass-vs-is-so
El is
es multipropósito, puede, por ejemplo, hacer is('.class')
, is(':checked')
, etc., lo que significa is
tiene más que hacer donde hasClass
está limitado, lo que solo verifica si se está configurando una clase o no.
Por lo tanto, hasClass
debería ser más rápido si el rendimiento en cualquier nivel es su prioridad.
Dado is
es más genérico que hasClass
y usa un filter
para procesar la expresión proporcionada, parece probable que hasClass
sea más rápido.
Ejecuté el siguiente código desde la consola de Firebug:
function usingIs() { for (var i=0; i<10000;i++) { $('div#example-0').is('.test'); } } function usingHas(){ for (var i=0; i<10000;i++) { $('div#example-0').hasClass('test'); } } usingIs(); usingHas();
Obtuve:
No es una gran diferencia, pero puede ser relevante si está haciendo muchas pruebas.
EDITAR cuando digo 'no es una gran diferencia', mi punto es que necesitas hacer 10000 ciclos para ver 0.8 s de diferencia. Me sorprendería ver una aplicación web en la que cambiar de is
a hasClass
vería una mejora significativa en todo el rendimiento. Sin embargo, reconozco que esto es una mejora del 35% en la velocidad.
Ambos deberían estar bastante cerca en términos de rendimiento pero $('#foo').hasClass('bar');
me parece más legible y semánticamente correcto.