Получите увеличенную арию

Я не нашел способ получить расширенное значение aria из DOM.

<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>

Я хочу проверить, если он true, тогда я могу изменить класс <i> на fa-search-minus. Я пробовал это, но всегда получаю значение undefined:

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

Ответы

Ответ 1

aria-expanded - это атрибут элемента, а не класс, поэтому селектор неверен. Во-вторых, вы должны использовать функцию attr(), чтобы получить значение этого атрибута. val() предназначен для извлечения атрибута value из связанных с формой элементов, таких как input и textarea. Попробуйте следующее:

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

Ответ 2

Вы можете использовать JavaScript для этого:

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

Пошаговое объяснение:

Получить желаемый элемент с помощью некоторого селектора - здесь я использую
```
document.getElementsByTagName('a')[0]
```

но вы можете использовать любой другой селектор, который вам нравится.

Доступ к массиву атрибутов элемента и поиск позиции требуемого атрибута - в этом случае это будет 4, потому что расширение арии - это 5-й атрибут тега.
Оттуда вы просто получите значение, и это должно дать вам "ложь" (в данном случае).

Единственная проблема с этим методом заключается в том, что он немного жестко закодирован, поэтому, если вы добавите еще несколько атрибутов в тег, позиция в массиве атрибутов для атрибута расширенной арии может измениться.

Ответ 3

Я хотел добавить второй чистый способ JavaScript, чтобы получить расширенный атрибут арии

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

Выше будет получить элемент по идентификатору, после чего вы можете получить любой атрибут по имени.