Отличие eventlistener от обычного события?

Question

[sky3107]

Собсна вопрос в том, какое отличие между объявлением события через ....addEventListener и ....onclick = fnc...
И пользуясь случаем, нашел на learn javascript такое событие: new Event(), new Mouse('click')...
И какая разница между ними...

Заранее благодарен за ответ...

Answer 1

[Дмитрий Лузанов]

А дочитать?

Comments

[sky3107]

Ну то есть то это то же самое... Только там в одном варианте можно вырубить событие...
И все, это единое отличие?

Я просто понять не могу в чем собсна разница...

[Дмитрий Лузанов]

sky3107:

Есть некоторые события, которые нельзя назначить через DOM-свойство, но можно через addEventListener.

Например, таково событие transitionend, то есть окончание CSS-анимации. В большинстве браузеров оно требует назначения через addEventListener.

Метод addEventListener позволяет назначить много обработчиков на одно событие.

[Дмитрий Лузанов]

"Вырубить событие" можно в обеих случаях. Перечитайте еще раз.

[Дмитрий Лузанов]

Представьте себе, что вы подключаете стороннюю библиотеку/используете модуль другого разработчика проекта и там вместо addEventListener используют oneven на элементе, к которому вам надо навесить еще один обработчик. Жопаболь.

[Сергей delphinpro]

Собсна вопрос в том, какое отличие между объявлением события через ....addEventListener и ....onclick = fnc...

По-моему это видно из самого синтаксиса, разве нет? Вы не видите?
Смотрите:

el.onclick = function(){ console.log(1); }
el.onclick = function(){ console.log(2); } // Видно, что мы ПЕРЕЗАПИСЫВАЕМ переменную

Так можно назначить только один обработчик.

el.addEventListener() - само название говорит нам "ДОБАВИТЬ"

el.addEventListener('click', function(){ console.log(1); }); // Добавить раз
el.addEventListener('click', function(){ console.log(2); }); // Добавить два
el.addEventListener('click', function(){ console.log(3); }); // Добавить три и т.д.