Javascript HTML页面中标题的屏幕阅读器可访问性

我有一个顶部有两个标题的页面，设置了页面的意图（h1为主标题，h2为次标题）。对于屏幕阅读器的可访问性，我希望确保每次加载页面时，屏幕阅读器都会读取

和

标记。阅读顺序应该是

，然后是

，HTML如下所示：

    <h1 id='myHeading'>ABCD</h1> 
    <h2>DEF</h2>

ABCD
DEF

---

我的应用程序使用JS、HTML和CSS。在加载此页面时，如何以编程方式制作屏幕阅读器所宣布的标题？换句话说，我应该在页眉标签上添加哪些HTML/aria属性，以便屏幕阅读器在页面加载完成后立即将其读取？

预期行为是可访问性的关键，尝试强制某些内容成为您想要的方式与它的行为方式相比，很少能提高可访问性

如果这两个项目如您所示在一起（之间没有任何文本），并且都是确定页面用途和位置所必需的，我建议您将整个项目设置为

，并使用样式来进行视觉区分

h1{
字体大小：46px；
}
h1>跨度{
字体大小：24px；
线高：36px；
颜色：红色；
}

ABCD

DEF

你能举一个HTML的例子吗？当然，在上面的问题中添加了它。你为什么选择在screenreader两个词之间不加空格？我知道你是对的。然而，我的问题是如何通过编程将标题读给屏幕阅读器？如中所示，我可以为此使用哪些aria属性。例如role=“live/assertive”等，在本场景中，这将符合标题HTML标记的要求。请详细解释您试图实现的目标以及原因？我确实试图在回答中解释说，试图让屏幕阅读器同时阅读两个标题会导致黑客攻击（不太可靠），而且可能不起作用。您是否正在尝试修复一个实际上不存在的问题，并且您是否熟悉屏幕阅读器用户如何导航页面？我认为，如果我能更好地理解这个场景，我可以提供更好的建议。另外，请告知其“标题”而不是“标题”，否则人们可能会感到困惑，认为您在谈论

元素，而不是从

到

。如果最终用户在屏幕阅读器上打开了自动读取，则默认情况下，它将读取页面标题，然后读取

。这是一个AJAX应用程序吗？如果是，则显示如何在单页应用程序（SPA）中处理导航。否则什么也不做，这只是一个标准的网页。除此之外，我仍然不明白您为什么要这样做，屏幕阅读器用户在大多数情况下会使用1-6键自动阅读页面上的标题。没问题，我想我不是很明白，很高兴我终于明白了您的意思！很高兴它有帮助，祝项目好运！