Javascript 获取 aria 扩展值

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/31762510/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 07:09:51  来源:igfitidea点击:

Get aria-expanded value

javascriptjqueryhtml

提问by Besbes Riadh

I didn't find a way to get aria-expanded value from DOM.

我没有找到从 DOM 中获取 aria-expanded 值的方法。

<a class="accordion-toggle collapsed" href="#collapse-One" data-parent="#accordion-1" data-toggle="collapse" aria-expanded="false">
    <i class="fa fa-search-plus"></i>
    test
</a>

I want to test if it's truethen I can change <i>class to fa-search-minus. I tried this but I always get an undefined value:

我想测试一下是否true可以将<i>类更改为fa-search-minus. 我试过这个,但我总是得到一个未定义的值:

console.log($(this).find('a.aria-expanded').val());

回答by Rory McCrossan

aria-expandedis an attribute on the element, not a class, so the selector is incorrect. Secondly, you should use the attr()function to get the value of that attribute. val()is intended to retrieve the valueattribute from form related elements, such as inputand textarea. Try this:

aria-expanded是元素上的属性,而不是类,因此选择器不正确。其次,您应该使用该attr()函数来获取该属性的值。val()旨在value从与表单相关的元素(例如input和 )中检索属性textarea。尝试这个:

console.log($(this).find('a[aria-expanded]').attr('aria-expanded'));

回答by Jon

I wanted to add in a second pure javascript way to get the aria-expanded attribute

我想添加第二种纯 javascript 方式来获取 aria-expanded 属性

document.getElementById('test').getAttribute('aria-expanded')

The above will get the element by id after that you can get any attribute by name.

上面将通过 id 获取元素,然后您可以通过名称获取任何属性。

回答by Johnn Smith

You can use JavaScript to achieve this:

您可以使用 JavaScript 来实现这一点:

document.getElementsByTagName('a')[0].attributes[4].value

Step by step explanation:

分步说明:

  1. Get the wanted element, by using some selector - here I use the

    document.getElementsByTagName('a')[0]
    
  1. 通过使用一些选择器获取想要的元素 - 在这里我使用

    document.getElementsByTagName('a')[0]
    

but you can use any other selector you like.

但您可以使用任何其他您喜欢的选择器。

  1. Access the attributes array of the element and find the position of the wanted attribute - in this case that will be 4, because aria-expanded is the 5th attribute of the tag.
  2. From there you just get the value, and that should give you "false" (in this case).
  1. 访问元素的属性数组并找到所需属性的位置 - 在本例中为 4,因为 aria-expanded 是标签的第 5 个属性。
  2. 从那里你只得到值,这应该给你“假”(在这种情况下)。

The only problem with this method is that it's a bit hard-coded, so if you add some more attributes to the tag, the position in the attributes array for the aria-expanded attribute might change.

此方法的唯一问题是它有点硬编码,因此如果您向标记添加更多属性,则 aria-expanded 属性在属性数组中的位置可能会发生变化。

回答by deezy

In 2020, I could do:

2020年,我可以做到:

document.querySelector('[aria-expanded]')?.getAttribute('aria-expanded')

to grab the first value and maybe something like:

获取第一个值,可能类似于:

Array.from(document.querySelectorAll('[aria-expanded]'))?
  .map(el => el.getAttribute('aria-expanded'))

to make an array of all aria-expanded values.

制作一个包含所有 aria 扩展值的数组。