Разница между addEventListener и onreadystatechange

Question

Читал https://developer.mozilla.org/ru/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest, раздел Отслеживание процесса загрузки. Там приведен код

oReq.addEventListener("progress", updateProgress, false);
oReq.addEventListener("load", transferComplete, false);
oReq.addEventListener("error", transferFailed, false);
oReq.addEventListener("abort", transferCanceled, false);

и https://developer.mozilla.org/ru/docs/Web/Guide/AJAX/%D0%A1_%D1%87%D0%B5%D0%B3%D0%BE_%D0%BD%D0%B0%D1%87%D0%B0%D1%82%D1%8C - Шаг 3 -простой пример

httpRequest.onreadystatechange = function() { alertContents(httpRequest); };
function alertContents(httpRequest) {

    if (httpRequest.readyState == 4) {
        if (httpRequest.status == 200) {
            alert(httpRequest.responseText);
        } else {
            alert('С запросом возникла проблема.');
        }
    }

}

В чем разница по производимому действию между addEventListener и onreadystatechange в данном конкретном случае?

Answer 1

Нет никакой разницы. addEventListener() позволяет повесить на событие слушателя не удаляя остальных слушателей. То есть можно повесить на одно событие два разных слушателя или два одинаковых.

Удалить слушателя можно методом removeEventListener().

Подробнее тут: https://www.w3schools.com/js/js_htmldom_eventlistener.asp

Можно остановить выполнение цепочки событий методом event.stopPropagation(): https://www.w3schools.com/jsref/event_stoppropagation.asp

Помимо этого можно отменять стандартные действия браузера по текущему событию методом event.preventDefault(): https://www.w3schools.com/jsref/event_preventdefault.asp

Answer 2

readystatechange - точно такое же событие, как и load, progress и т.д.

Способов добавить обработчик событию - два

задать соответствующее свойство, начинающееся с on
воспользоваться функцией .addEventListener

БЛОГ НА HUSL

Разница между addEventListener и onreadystatechange

Ответы (2 шт):