Question

如果我在这里使用正确的语法检查“aria-expanded”是否适用于css类“classname”的特定元素集，请告诉我：

    if ($(‘.classname’).hasAttribute('aria-expanded','true')) {  output here }

Answer 1

jQuery没有$ = docuument.querySelector方法，所以我假设document.querySelectorAll。（注意：不是hasAttribute;因此，您只考虑单个元素。）

getAttribute方法只接受一个参数：您要检查的属性的名称。要检查该属性的值，您需要使用if( $('.classname').getAttribute('aria-expanded') === 'true') {}然后进行比较。所以你可以这样做：

attr

如果您使用的是jQuery，那么您只需使用if ($('.classname').attr('aria-expanded') === 'true') {}方法：

function allHaveAttribute(elements, attrName, attrValue) {
    // First, check that all elements have the attribute
    for (var i = 0; i < elements.length; i++) {
        if (!elements[i].hasAttribute(attrName)) return false;
    }

    if (attrValue) { // if we're checking their value...
        for (var i = 0; i < elements.length; i++) {
            if (elements[i].getAttribute(attrName) !== attrValue)
                return false;
        }
        return true;
    } else { // we know all elements have the attribute
        return true;
    }
}

var els = document.querySelectorAll('.classname');

if (allHaveAttribute(els, 'aria-expanded', 'true') {
    // action here
}

另请参阅MDN docs for hasAttribute。

如果您尝试检查一组元素，可以执行以下操作：

<div id="div1" >
    <input class="myinput" value="input inside div1"/>
 </div>

<div id="div2" >
   <input class="myinput" value="input inside div2"/>
</div>

JSBin示例：http://jsbin.com/payaqijeqa/edit?js,console

Answer 2

jQuery没有.hasAttribute功能
如果确实如此，那很可能只适用于第一集

以下使用原生JavaScript（ES5）检查集合.every中的document.querySelectorAll('.classname')元素是否已将该属性设置为true。

let allSet = [].every.call(document.querySelectorAll('.classname'), function(el) {
    return el.getAttribute('aria-expanded') === 'true';
});

注意：上述测试区分大小写。它也会忽略任何根本没有该属性的元素。如果后者是个问题：

let allSet = [].every.call(document.querySelectorAll('.classname'), function(el) {
    return el.hasAttribute('aria-expanded') && el.getAttribute('aria-expanded') === 'true';
});

Answer 3

您可以检查每个元素是否具有类＆＃34; className＆＃34;具有属性＆＃34; aria-expanded =＆＃39; true＆＃39;＆＃34;用：

if( $(".className").length === $(".className").filter("[aria-expanded='true']").length) {
     //output here
}

Answer 4

CSS具有属性选择器，允许选择具有特定属性的元素。如果你否定了选择器（这是jQuery独有的），你可以通过使用来测试是否有任何具有该类但没有属性值的元素：

$(".className[aria-expanded!='true']").length == 0

如何检查属性值

4 个答案: