NodeList의 요소 중 ES6을 사용하여 특정 클래스가 있는지 확인하십시오.

Question

NodeList의 요소에 특정 클래스가 있는지 확인하고 싶습니다. 예를 들어

, jQuery를 함께 그냥 무언가처럼 :

는

//if any .item element has active class, return true 
var isActive = $(".item").hasClass("active"); 

만 자바 스크립트로 내가 할 수있는,하지만 약간 더 긴 코드 :

var isActive = false; 
 
var items = Array.from(document.getElementsByClassName("item")); 
 

 
items.forEach(function(item, index) { 
 
    if(item.className.indexOf('active') > 0) { 
 
\t isActive = true; 
 
    } 
 
}); 
 

 
alert(isActive);

<div class="item">1</div> 
 
<div class="item">2</div> 
 
<div class="item active">3</div> 
 
<div class="item">4</div>

방법 ES6에서이 작업을 수행 할 수 있습니까? 선택자를 도우미가 있습니까?

감사합니다.

Answer 1

그것은 ES2015과는 아무 상관이없는,하지만 당신은 많은 기본의 jQuery API처럼 document.querySelector()를 사용할 수 있습니다

var isActive = document.querySelector(".item.active") != null; 

Answer 2

Array.from(document.getElementsByClassName("item")).some(({classList}) => 
    classList.contains('active')) 

위의 코드와 본질적으로 동일한 ES6이 가장 좋습니다.

Answer 3

당신은 정말 ES6는 바닐라 JS에서 같은 일을 수행 할 필요가 없습니다.

// jQuery 
var isActive = $(".item").hasClass("active"); 

// Plain JavaScript 
var isActive = document.querySelector('.item').classList.contains('active');