JQuery.hasClass() vs .is()

существует ли предпочтительный способ определения того, назначен ли элемент классу с точки зрения производительности?

$('#foo').hasClass('bar');

или

$('#foo').is('.bar');

Ответ 1

Обновление:

Я сделал тест, следующий за комментарием, и четыре upvotes для очень комментариев. Оказывается, то, что я сказал, является правильным ответом. Вот результат:

enter image description here

http://jsperf.com/hasclass-vs-is-so


is является многоцелевым, вы можете, например, сделать is('.class'), is(':checked') и т.д., что означает is имеет больше возможностей, чем hasClass ограничен, который проверяет только класс, который установлен или нет.

Следовательно, hasClass должен быть быстрее, если производительность на любом уровне является вашим приоритетом.

Ответ 2

Так как is более общий, чем hasClass, и использует filter для обработки предоставленного выражения, кажется вероятным, что hasClass быстрее.

Я запустил следующий код с консоли 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();

Я получил:

  • usingIs: 3191.663ms
  • usingHas: 2362.523ms

Не большая разница, но может быть актуальной, если вы много тестируете.

EDIT, когда я говорю "не огромная разница, я хочу сказать, что вам нужно сделать 10000 циклов, чтобы увидеть 0.8s разницы. Я был бы удивлен, увидев веб-приложение, так что переход от is до hasClass значительно улучшился бы во всей производительности. Тем не менее, я утверждаю, что это 35% -ное улучшение скорости.

Ответ 3

Оба должны быть довольно близки по производительности, но $('#foo').hasClass('bar'); кажется более читабельным и семантически правильным для меня.

Ответ 4

.hasClass намного быстрее, чем .is Вы можете проверить это из здесь. Измените тестовый пример в соответствии с вами.