我应该使用JavaScript更新aria- *属性吗？
[英]Should I be updating aria-* attributes with JavaScript?
问题描述
Let's say I have the following HTML code: 
假设我有以下HTML代码：
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
p {
display:none;
}
input:focus + p {
display:block;
}
</style>
</head>
<body>
<input />
<p aria-hidden="true">This field should not exceed 200 characters.</p>
</body>
</html>
When I put my mouse cursor into the input field, the paragraph appears. 当我将鼠标光标放在input字段中时，将出现该段落。 However, the paragraph still has the attribute aria-hidden="true" despite being visible. 但是，尽管可见，该段落仍具有aria-hidden="true"属性。
In terms of web accessibility, should I be introducing JavaScript code that will explicitly toggle the aria-hidden between true or false depending on whether my CSS rules shows or hides the paragraph tag? 在网络的可访问性方面，我要介绍的JavaScript代码，将明确地切换aria-hidden之间true或false取决于我的CSS规则是否显示或隐藏段落标记？
I'm trying to wrap my head around how these aria attributes are used, and whether they imply the need of a JavaScript developer to add additional code that alters the HTML mark up in a way that reflects the behaviour described by my CSS. 我正在努力解决这些aria属性的使用方式，以及它们是否暗示JavaScript开发人员需要添加其他代码来更改HTML标记，从而以反映我的CSS描述的行为的方式来思考。
1 个解决方案
解决方案1
1 2018-03-13 22:26:21
Your particular example is a little weird, but in general, yes, javascript should be used to change the value of the aria attributes. 您的特定示例有些奇怪，但是总的来说，是的，应该使用javascript来更改aria属性的值。 Just like you can use JS to change the value of any element attribute. 就像可以使用JS更改任何element属性的值一样。
If you had a custom checkbox such as <span role='checkbox' aria-checked='false'> (*), then you'd need JS to change the value of aria-checked from FALSE to TRUE when the checkbox is selected (and vice versa, of course). 如果您有一个自定义复选框，例如<span role='checkbox' aria-checked='false'> （*），那么当选中该复选框时，您需要JS将aria-checked的值从FALSE更改为TRUE。 （当然，反之亦然）。
(*) If you have a custom checkbox, you're going to have several other attributes that are not shown here, such as tabindex, mouse and keyboard handlers, etc. （*）如果您有一个自定义复选框，那么您将拥有其他未在此处显示的其他属性，例如tabindex，鼠标和键盘处理程序等。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.