ARIA：将HTML元素视为一个整体

Question

有没有办法告诉辅助工具将一个元素（例如：<div>）作为一个整体处理，而不是将其拆分为子元素？

第一个例子

使用iOS VoiceOver和带有字段的字段，它会分成两个不同的元素：

第二个例子

这些元素分为两部分，其中最佳解决方案将被阅读＆＃34; 122分＆＃34;和＆＃34;第一个位置＆＃34;：

<div class="row">
    <div class="stat lg col-xs-6">
        <span>122</span>
        <i class="icon icon-prize" aria-hidden="true"></i>
        <h5>Points</h5>
    </div>
    <div class="stat lg col-xs-6">
        <span>1º</span>
        <i class="icon icon-prize" aria-hidden="true"></i>
        <h5>Position</h5>
    </div>
</div>

Answer 1

虽然你的示例代码实际上工作得很好，但iOS上的VoiceOver确实有时会分割一个句子。我使用您的代码作为下面屏幕截图中的第一行，然后复制没有<a>标记作为第二行的文本。第二行被VoiceOver分解，但<a>标记没有。

<span class="label info">
   <a href="/round/next">
      Next round starts <strong>in 3 days</strong>
   </a>
</span>
<br>
Next round starts <strong>in 3 days</strong>

（注意：我为VoiceOver启用了增强的轮廓，因此黑色轮廓可能比您以前看到的更粗。）

Answer 2

我发现使用role="button"元素被视为一个组，并且它的innerText属性被读取，但是作为一个按钮宣布。