programing

요소에 jQuery를 사용하는 CSS 클래스가 있는지 확인합니다.

css3 2023. 7. 29. 08:49

요소에 jQuery를 사용하는 CSS 클래스가 있는지 확인합니다.

저는 jQuery와 함께 작업하고 있으며 요소에 특정 CSS 클래스가 연결되어 있는지 쉽게 확인할 수 있는 방법이 있는지 알아보고 있습니다.

나는 내가 찾고 있는 요소의 아이디와 CSS 클래스를 가지고 있습니다.저는 단지 if 문에서 요소에 대한 클래스의 존재에 기초하여 비교를 할 수 있으면 됩니다.

사용hasClass방법:

jQueryCollection.hasClass(className);

또는

$(selector).hasClass(className);

인수는 (분명히) 확인 중인 클래스를 나타내는 문자열이며 부울을 반환합니다(따라서 대부분의 jQuery 메서드처럼 체인을 지원하지 않습니다).

참고: 합격한 경우className공백을 포함하는 인수. 컬렉션의 요소에 대해 문자 그대로 일치합니다.className현을 매다예를 들어, 당신에게 요소가 있다면,

<span class="foo bar" />

그러면 이것이 돌아올 것입니다.true:

$('span').hasClass('foo bar')

그리고 이것들은 돌아올 것입니다.false:

$('span').hasClass('bar foo')
$('span').hasClass('foo  bar')

FAQ에서

elem = $("#elemid");
if (elem.is (".class")) {
   // whatever
}

또는:

elem = $("#elemid");
if (elem.hasClass ("class")) {
   // whatever
}

부정에 대해서는, 요소에 클래스가 없는지 알고 싶다면 마크가 말한 대로 하면 됩니다.

if (!currentPage.parent().hasClass('home')) { do what you want }

jQuery 사용 안 함:

var hasclass=!!(' '+elem.className+' ').indexOf(' check_class ')+1;

또는:

function hasClass(e,c){
    return e&&(e instanceof HTMLElement)&&!!((' '+e.className+' ').indexOf(' '+c+' ')+1);
}
/*example of usage*/
var has_class_medium=hasClass(document.getElementsByTagName('input')[0],'medium');

이것은 jQuery보다 훨씬 빠릅니다!

여기에 도착했지만 실제로 jQuery 무료 방법을 찾고 있는 사람을 돕기 위해:

element.classList.contains('your-class-name')

공식 jQuery FAQ 페이지를 확인합니다.

요소에 특정 클래스가 있는지 여부를 테스트하는 방법

 $('.segment-name').click(function () {
    if($(this).hasClass('segment-a')){
        //class exist
    }
});

저의 경우 'is'a jQuery 함수를 사용했고, 다른 css 클래스를 가진 HTML 요소가 추가되었으며, 이들 가운데 특정 클래스를 찾고 있었기 때문에 이미 다른 css 클래스가 있는 html 요소에 동적으로 추가된 클래스를 확인하기 위해 "is"라는 좋은 대안을 사용했습니다.

간단한 예:

 <!--element html-->
 <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

 <!--jQuery "is"-->
 $('#menu').is('.cbp-spmenu-open');

고급 예제:

 <!--element html-->
    <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

   <!--jQuery "is"-->
    if($('#menu').is('.cbp-spmenu-bottom.cbp-spmenu-open')){
       $("#menu").show();
    }

언급URL : https://stackoverflow.com/questions/263232/determine-if-an-element-has-a-css-class-with-jquery