HTML 辅助功能：制作屏幕 reader 显示隐藏文本时宣布
HTML accessiblity: make a screen reader announce hidden text when it gets shown
根据 w3 documentation 我们可以使用 aria-live 属性告诉屏幕 reader 在 HTML 元素发生变化时读取其文本内容。然而，在我的例子中，我不会更新任何文本，只是希望屏幕 reader 在 <span> 的内容在某些条件下变得可见时宣布它的内容（即，通过使用 jQuery的.show()函数)
这是我的 HTML 和 JS 的简化：
<div class="toggleable_element" hidden>
<span aria-live="assertive">Text to be read out</span>
</div>
....
<script>
$("#toggleable_element").show();
</script>
像这样使用 aria-live 不会触发屏幕 reader 阅读文本（我在这种情况下使用 JAWS）。
另一个建议是添加属性 role="alert" 尽管这似乎也不会触发屏幕 reader 公告。
关于如何让 span 的内容被大声朗读有什么建议吗？
您使用的是哪个版本的 JAWS 和 Web 浏览器？
我知道 JAWS 和 IE11 在使用 aria-live 时经常不能很好地协同工作。
在最近的屏幕上 reader + 浏览器组合，您所做的应该正常工作。
我试过 IE/Firefox/Chrome+Jaws/NVDA 以及 iOS 上的 VO 10. aria-live 元素的内容在其内容更改时被读出，但当它由于 CSS 显示或可见性属性的更改而变得可见。
当在 DOM 中添加这样的元素时，它也会被读出。
请注意，它仅适用于显示和可见性 CSS 属性。可能影响有效可见性的其他 CSS 属性不起作用，例如opacity, transform, off-screen positionning, etc. 后者通常完全被屏幕忽略 readers.
但是，在 DOM 中显示或添加元素后添加 aria-live 属性是行不通的。
这样做，该元素永远不会成为 aria-live 区域，也不会读出以后的内容更改。
为此，几乎所有 SR+浏览器组合都一致。
根据 w3 documentation 我们可以使用 aria-live 属性告诉屏幕 reader 在 HTML 元素发生变化时读取其文本内容。然而，在我的例子中，我不会更新任何文本，只是希望屏幕 reader 在 <span> 的内容在某些条件下变得可见时宣布它的内容（即，通过使用 jQuery的.show()函数)
这是我的 HTML 和 JS 的简化：
<div class="toggleable_element" hidden>
<span aria-live="assertive">Text to be read out</span>
</div>
....
<script>
$("#toggleable_element").show();
</script>
像这样使用 aria-live 不会触发屏幕 reader 阅读文本（我在这种情况下使用 JAWS）。
另一个建议是添加属性 role="alert" 尽管这似乎也不会触发屏幕 reader 公告。
关于如何让 span 的内容被大声朗读有什么建议吗？
您使用的是哪个版本的 JAWS 和 Web 浏览器？
我知道 JAWS 和 IE11 在使用 aria-live 时经常不能很好地协同工作。
在最近的屏幕上 reader + 浏览器组合，您所做的应该正常工作。
我试过 IE/Firefox/Chrome+Jaws/NVDA 以及 iOS 上的 VO 10. aria-live 元素的内容在其内容更改时被读出，但当它由于 CSS 显示或可见性属性的更改而变得可见。 当在 DOM 中添加这样的元素时，它也会被读出。 请注意，它仅适用于显示和可见性 CSS 属性。可能影响有效可见性的其他 CSS 属性不起作用，例如opacity, transform, off-screen positionning, etc. 后者通常完全被屏幕忽略 readers.
但是，在 DOM 中显示或添加元素后添加 aria-live 属性是行不通的。 这样做，该元素永远不会成为 aria-live 区域，也不会读出以后的内容更改。
为此，几乎所有 SR+浏览器组合都一致。