Найти все атрибуты display:none и добавить атрибут aria-hidden с помощью JavaScript

Есть ли способ найти все экземпляры, в которых используется свойство display:none, и добавить атрибут aria-hidden="true" с помощью JavaScript.

На моем сайте есть сотни таких случаев, и я ищу более быстрый способ.

Может быть что-то вроде этого: (добавлено в функцию)

$(*).css( "display", "none" ).attr( "aria-hidden", "true" );

javascript jquery accessibility wai-aria
person Smithy    schedule 12.06.2015    source источник
comment
stackoverflow.com/questions/1220834/   -  person Shekhar Joshi    schedule 12.06.2015

Ответы (3)


arrow_upward
5
arrow_downward

используйте селектор hidden(), чтобы идентифицировать все отображаемые элементы.

$( ":hidden").attr( "aria-hidden", "true" );

ДЕМО

person Balachandran    schedule 12.06.2015

arrow_upward
8
arrow_downward

Эффект aria-hidden="true" заключается в указании браузеру не показывать элемент в дереве доступности, даже если он не скрыт.

Браузеры не предоставляют доступ к каким-либо элементам API специальных возможностей, которые display:none.

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

person unobf    schedule 13.06.2015
comment
Программа чтения с экрана по-прежнему считывает содержимое с атрибутом display:none, поэтому на самом деле требуется aria-hidden. - person Smithy; 13.06.2015
comment
@RAS, это абсолютная туфта - person unobf; 14.06.2015
comment
@RAS здесь ссылка на одну из спецификаций, в которой говорится о том, когда контент не должен отображаться в дереве доступности w3.org/TR/core-aam-1.1/#h-exclude_elements2 - person unobf; 14.06.2015
comment
@Tin И display: none, и visibility: hidden не раскрываются SR. Другие объявления могут зависеть или не зависеть от SR (opacity:0 и т. д.), но эти 2 объявления совершенно безопасны для использования. - person FelipeAls; 22.06.2015

arrow_upward
0
arrow_downward

РЕДАКТИРОВАТЬ:

Вы можете использовать фильтр, но это не оптимальное решение:

$("*").filter(function() { return $(this).css("display") == "none" })
person suvroc    schedule 12.06.2015
comment
Он хочет добавить ARIA, а не обнаружить его. - person Evan Knowles; 12.06.2015