javascript 通过带有classList的正则表达式检查元素是否包含类

stszievb 于 2023-08-02 发布在 Java

关注(0)|答案(4)|浏览(134)

我有一个简单的元素列表，看起来像这样：

<ul class="items-list">
  <li class="item item-1"></li>
  <li class="item item-2"></li>
  <li class="item item-3"></li>
  <li class="item item-4"></li>
</ul>

字符串
我通过以下方式选择列表

items = document.getElementsByClassName('items-list')[0]

型
最后，在for..in循环中，我想提取类名'item-*'。由于我想在没有jQuery或其他库的情况下实现它，我想知道如何以最优雅的方式实现它，例如

if (item.classList.contains('item-.*'))
  do_something()

型

JavaScript

来源：https://stackoverflow.com/questions/21390675/check-if-an-element-contains-a-class-by-regex-with-classlist

4条答案

按热度按时间

wgx48brx1#

你可以检查some（ES5）类是否匹配你的regExp：

if(item.className.split(' ').some(function(c){ return /item-.*/.test(c); }))
  do_something()
/* or */
if([].some.call(item.classList, function(c){ return /item-.*/.test(c); }))
  do_something()

字符串
或者，在ES6中，使用arrow functions，您可以将其简化为

if(item.className.split(' ').some(c => /item-.*/.test(c)))
  do_something()
/* or */
if([].some.call(item.classList, c => /item-.*/.test(c)))
  do_something()

型
当然，如果你想要最大的性能，可以使用循环：

for (var i=0, l=item.classList.length; i<l; ++i) {
    if(/item-.*/.test(item.classList[i])) {
        do_something();
        break;
    }
}

型

赞(0）回复(0）举报 2023-08-02

qni6mghb2#

可以使用正则表达式测试className是否包含item-

if (/item-/.test(item.className)) {
  // ...
}

字符串

赞(0）回复(0）举报 2023-08-02

u0sqgete3#

var items = document.getElementsByClassName('items-list')[0];
  for (var i = 0, len = items.children.length; i < len; i++) {
    if (/item-/.test(items.children[i].className)) {
      console.log(items.children[i].className);
      // or doSomething();
  }
}

字符串
http://jsfiddle.net/tcs6b/可能？

赞(0）回复(0）举报 2023-08-02

bis0qfac4#

由于没有答案提到Array.from()，我将使用我自己的版本：

// now you have a real array, so you can call any Array method
const classNames = Array.from(item.classList);
// now you can perform your checks on the array
const classNameHasGivenPattern = classNames.some(className => /item-/.test(className));
if (classNameHasGivenPattern) {
  // ...
}

字符串

赞(0）回复(0）举报 2023-08-02

我来回答

javascript 通过带有classList的正则表达式检查元素是否包含类

4条答案

相关问题

热门标签

最新问答