使用ES6

Question

我想检查NodeList中的任何元素是否具有特定的类。

例如，使用jQuery我只需执行以下操作：

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

只有我可以使用Javascript，但代码稍长：

＆＃13;

＆＃13;

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

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

alert(isActive);

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;

我如何使用ES6执行此操作？选择器有一个助手吗？

谢谢！

Answer 1

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

可能是最好的ES6可以提供的，这与上面的代码基本相同。

Answer 2

它与ES2015无关，但您可以像基本的jQuery API一样使用document.querySelector()：

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

Answer 3

你真的不需要ES6在vanilla JS中做同样的事情。

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

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

Answer 4

您可以在节点列表上.find()并返回第一个真实结果。

const activeEl = Array.prototype.find.call (items, item => item.classList.contains('active'));