itsource

jQuery .hasClass() vs.is()

mycopycode 2023. 10. 29. 19:43
반응형

jQuery .hasClass() vs.is()

성능 관점에서 요소에 클래스가 할당되는지 여부를 결정하는 바람직한 방법이 있습니까?

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

아니면

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

업데이트:

저는 댓글에 따라 테스트를 했고 댓글에 4개의 업보팅을 했습니다.제가 말한 것이 정답임이 드러났습니다.결과는 다음과 같습니다.

enter image description here

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


예를 들어, 는 다목적입니다.is('.class'),is(':checked'), 등이 의미하는 것은is가 설정 중인 클래스만 확인하는 제한된 위치에서 더 많은 작업을 수행합니다.

이런 이유로,hasClass어떤 수준에서든 성능이 우선적으로 요구된다면 더욱 빨라질 것입니다.

부터is보다 일반적입니다.hasClass쓰임새filter제공된 표현을 처리하는 것은 다음과 같습니다.hasClass더 빠릅니다.

파이어버그 콘솔에서 다음 코드를 실행했습니다.

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();

알 수 있습니다.

  • 사용Is: 3191.663ms
  • Has 사용: 2362.523ms

큰 차이는 없지만 테스트를 많이 하는 경우 관련이 있을 수 있습니다.

' 차이는 없습니다. 제 요점은 10000 사이클을 수행해야 0.8초의 차이를 볼 수 있다는 것입니다.웹 애플리케이션을 보고 있으면 깜짝 놀랄 겁니다.is로.hasClass전반적인 성능이 크게 향상될 것으로 예상됩니다.하지만 속도가 35% 향상된 것은 인정합니다.

성능적인 면에서는 둘 다 비슷해야 하지만.$('#foo').hasClass('bar');제가 보기에는 더 가독성이 있고 의미론적으로 정확해 보입니다.

.hasClass보다 훨씬 빠릅니다..is테스트는 여기서 할 수 있습니다.사용자에 따라 테스트 케이스를 바꿉니다.

언급URL : https://stackoverflow.com/questions/4901553/jquery-hasclass-vs-is

반응형