JAWS仅在IE中读取“ aria-live”区域内的DOM节点的删除

Question

The live region is:

<div aria-live='assertive' id='abc'> </div>

In JavaScript, the first change I make is to

document.getElementById("abc").innerHTML="<span>Processing</span>";

Next, I make another change:

document.getElementById("abc").innerHTML="<span>Done</span>";

JAWS has no problem in Firefox and reads both "Processing" and "Done". But IE reads "Processing Removing Processing Done"

I understand that I am replacing a <span> with a new <span> . But how do I make JAWS ignore giving that update of removal?

Answer 1

我成功克服了IE中的这个错误的唯一方法是隐藏要删除的元素，添加新元素，然后再删除隐藏的元素。

Answer 2

To understand this bug in IE, you have to look to the documentation for the aria-relevant attribute which specify which changes you want the screenreader to be notified.

See the following page in the Microsoft documentation: aria-relevant attribute

In your case, IE considers (falsely) that you are doing a text update (because of the use of innerHTML which is considered as a string), so it notifies deletion and addition:

Updates are announced only as nodes are added, or as text is added or removed .

The solution should be to add or remove with the use of addChild() and removeChild() functions.