태그에 특정 클래스 있는지 JavaScript에서 확인하는 방법

 

javaScript에서 특정 태그에

클래스가 있는지 확인하는 방법은

아주 간단합니다.

 

아래의 예제를 통해서

확인해보시면 되겠습니다.

 

---

<div id="test" class="class1 class2"></div>

<script>

let tag = document.getElementById('test'); // id가 test인 태그를 가져온다.

console.log( tag.className.includes('class1') ); // 태그에 클래스명이 class1 있는지 확인한다. true
console.log( tag.className.includes('class2') ); // 태그에 클래스명이 class2 있는지 확인한다. true
console.log( tag.className.includes('class3') ); // 태그에 클래스명이 class3 있는지 확인한다. false

</script>

---

 

javaScript에서는 위와 같이

className을 includes를 통해

class명이 일치하는 문자가 있는지

체크하여 boolean 형태로

받을 수 있습니다.

 

 

아래는 똑같은 상황에서

jQuery로 체크하는

방법입니다.

 

---

<div id="test" class="class1 class2"></div>

<script>

let tag = $('#tag'); // id가 test인 태그를 가져온다.

console.log( tag.hasClass('class1') ); // 태그에 클래스명이 class1 있는지 확인한다. true
console.log( tag.hasClass('class2') ); // 태그에 클래스명이 class2 있는지 확인한다. true
console.log( tag.hasClass('class3') ); // 태그에 클래스명이 class3 있는지 확인한다. false

</script>

---

 

jQuery에서는

hasClass를 이용하여

확인할 수 있습니다.