sr-only не работает в Internet Explorer

Question

У меня есть живая область, где кнопка при нажатии увеличивает отображаемое значение (похоже на голоса / лайки). Сообщение, которое будет считывать программа чтения с экрана, является вычисленным значением, например: "1 человеку нравится эта статья"/"Никому не понравилась эта статья"/"8 людям нравится эта статья". Эти сообщения вычисляются в клиентском скрипте (значение счетчика) и определяются в серверном скрипте (финальное сообщение).

<div class="sr-only" role="alert" aria-live="polite">

   <span id="feedback-count">{{c.message}} /span>

</div>

Это прекрасно работает в Chrome, но не считывает сообщения в IE в Windows с помощью программы чтения с экрана Jaws.

Answer 1

Я перепробовал несколько подходов, и этот подход лучше всего подходит для меня. Исправлена ​​проблема, и текст программы чтения с экрана читался отлично во всех браузерах.

functionToBeCalled = function(message) {
    aria_message = message;
  document.getElementById('screen-reader-tag-id').innerHTML = '';
    document.getElementById('screen-reader-tag-id').innerHTML += '<p class="sr-only">'+ aria_message+'</p>'
 }

<div id="screen-reader-tag-id" class="sr-only" role="alert" aria-live="polite">
  </div>