简体   繁体   English

如何将类数组应用于classList.contains?

[英]How to apply an array of classes to classList.contains?

In my HTML, I have a div like so: 在我的HTML中,我有一个像这样的div

<div class="a b c"></div>

In my JavaScript, I have an array of classes that I'm interested in: 在我的JavaScript中,我有一系列我感兴趣的类:

var goodClasses = ['a', 'c'];

In good browsers, I can use the awesome classList feature to test whether or not my div has the appropriate classes: 在良好的浏览器中,我可以使用awesome classList功能来测试我的div是否具有适当的类:

return div.classList.contains(goodClasses[0], goodClasses[1]);

This is okay, but what I'd really like to do is something like this (the syntax is silly, but this is the general idea): 这没关系,但我真正喜欢的是这样的(语法很愚蠢,但这是一般的想法):

return div.classList.contains.apply(div, goodClasses);

Is there some way to do this? 有办法做到这一点吗? If I have to loop through my array of classes anyway, classList becomes a whole lot less cool. 如果我必须遍历我的数组类, classList变得不那么酷了。

As @Felix Kling correctly points out, classList.contains accepts only one argument. 正如@Felix Kling正确指出的那样, classList.contains只接受一个参数。

If your supported browsers support the every() method on Array , you could do this: 如果支持的浏览器支持Array上的every()方法,则可以执行以下操作:

return goodClasses.every( function( c ) {
    return div.classList.contains( c );
});

Browsers that don't support it can use the MDC compatibility fix : 不支持它的浏览器可以使用MDC兼容性修补程序

if (!Array.prototype.every)
{
  Array.prototype.every = function(fun /*, thisp */)
  {
    "use strict";

    if (this === void 0 || this === null)
      throw new TypeError();

    var t = Object(this);
    var len = t.length >>> 0;
    if (typeof fun !== "function")
      throw new TypeError();

    var thisp = arguments[1];
    for (var i = 0; i < len; i++)
    {
      if (i in t && !fun.call(thisp, t[i], i, t))
        return false;
    }

    return true;
  };
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何使用JavaScript中的classList.contains在引导程序下拉菜单中获取li类 - how can I get the li classes inside the bootstrap dropdown menu using the classList.contains from javascript 如何将使用 classList.contains() 作为条件的 if 语句转换为 switch 语句? - How to turn if statement that use classList.contains() as condition to switch statement? IE9及更早版本中不支持classList.contains(&#39;outputDiv&#39;), - classList.contains('outputDiv') not supported in IE 9 and older, 在比较 classList.contains 的 if-else 语句时,如何在没有 setInterval 的情况下更新类? - How can I update the class without setInterval when comparing if-else statement for classList.contains? classList.contains(“active”) 返回 false 或错误。 从不真实 - classList.contains(“active”) returns false OR error. never true classList.contains 返回 false 期待 true [暂停] - classList.contains returns false expecting true [on hold] 如何遍历元素数组以检查类列表是否包含与在不同数组中找到的任何 id 相同的值 - How to loop through an array of elements to check if classlist contains a value which is the same as any of the ids found in a different array "如何在 reactjs 中应用 classList.toggle(&quot;active&quot;)" - How to apply classList.toggle("active") in reactjs ClassList 包含子元素 - ClassList contains of elements child javascript innerHTML 如果 classList 包含这个 - javascript innerHTML if classList contains this
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM