релевантно для арии при замене всего содержимого таблицы

Question

Я тестирую некоторые из своих реализаций специальных возможностей с помощью JAWS и заметил, что для одной из моих таблиц вся таблица считывается каждый раз, когда добавляется одна строка, несмотря на использование aria-relevant=additions.

Соответствующая разметка выглядит следующим образом:

<table role=log aria-live=polite aria-relevant=additions>
    <thead>
        <tr>
            <th scope=col>Name</th>
            <th scope=col>Time</th>
            <th scope=col>Comment</th>
        </tr>
    </thead>
    <tbody id=eventComments></tbody>
</table>

Теперь код обновления таблицы выполняется с помощью запроса AJAX, который извлекает все комментарии и помещает их в таблицу. tbody:

window.setInterval(function() {
    $.ajax({
        type: 'GET',
        url: 'event.php',
        data: {
            eventID: ...
            page: 'getComments'
        },
        dataType: 'html',
        success: function(data) {
            $('#eventComments').html(data);
        }
    });
}, 10000);

Таким образом, первый комментарий вернется, например:

<tr><th scope=row>Richard</th><td>2014-01-11 01:01:00</td><td>Security check in</td></tr>

При наличии двух комментариев данные будут выглядеть так:

<tr><th scope=row>Justin</th><td>2014-01-11 01:18:31</td><td>Equipment failure</td></tr>
<tr><th scope=row>Richard</th><td>2014-01-11 01:01:00</td><td>Security check in</td></tr>

Каждый раз, когда происходит обновление, считывается вся таблица, тогда как я просто хочу, чтобы были прочитаны вновь добавленные строки.Фактически, вся таблица считывается каждые 10 секунд, даже если новые строки не добавляются!Я знаю, что добавление строк с использованием .prepend() это возможно, но было бы невозможно получить с сервера только новые строки.

Есть ли способ получить все строки с сервера и указать программе чтения с экрана, чтобы она читала только новые строки?

Answer 1

Лучшим решением было бы получать с сервера только новые строки, поскольку ответ будет меньше и, вероятно, быстрее.Однако, если это невозможно, вы можете получить старые строки из DOM и вычесть их из данных, полученных с сервера, с помощью метода replace.Затем вы можете использовать prepend, чтобы добавить в DOM только новые строки, в результате чего JAWS будет объявлять только новые строки.

window.setInterval(function() {
    $.ajax({
        type: 'GET',
        url: 'event.php',
        data: {
            eventID: ...
            page: 'getComments'
        },
        dataType: 'html',
        success: function(data) {
            // strip the old rows from the data retrieved from the server
            var oldRows = $('#eventComments').html();
            var reg = new RegExp(oldRows,"g");
            var newRows = data.replace(reg,"");
            $('#eventComments').prepend(newRows);
        }
    });
}, 10000);