Javascript tutorial addEventListener Best HTML Event Handling W3C Recommended Method

[@ga7853]

Adam, you are great, no one has bother to show old ways and new ways the way you do, thanks a million for a fully explained subject.

[@StuartKaufman]

Here's a Fantastic Javascript EventListener Tutorial. Thanks Adam Khoury!!

[@tonywilliams2164]

The "Down-2-Earth Guru"!! Appreciate the heads up Adam!

[@SonaSwing]

Very useful, I am just learning so don't even know the old way but your video makes very much sense. Thank you!

[@nc840]

you are awesome. my professor recommend your video

[@McGavel1]

Cool stuff and thanks for showing browser backward compatibility!

[@cink09]

i love the way you explain the whole process, very helpful, found my answer thanks to you.

[@ladyd7778]

Love this tutorial. Simple and easy to follow. Thank you so much!

[@carmenxena]

Really explains this stuff clearly. Nice!!!

[@iggymach]

Awesome, this will release my HTML code from some unnecessary weight :-)

[@McGavel1]

I love how we can just use the *this* keyword to access a object's methods and properties

[@hercules1943]

very thanks! i very like your tutorial! thanks again.

[@moodkilt2665]

hmm..actually i rather use the old way. In wich way is it not good to have the callings withing the body tags...Is it only because it can get messy for you to find where you are in the document or will the page run into more errors or something like that?

[@donfeto7636]

Good Job Man You Are The Best

[@alvincruz8296]

This video is very instructive and easy to follow. But its 2018 already, I am thinking if the methods as shown here are still the best as of now.

[@General_Aladeen]

yup, still they are.

[@iamreg1965]

No basically. The event model has always supported capturing, target and bubbling phases. The eventerlistener interface implements one method - eventHandler. One can utilise event delegation controlled by objects implementing the eventlistener interface. It makes it a breeze to dynamically add and remove both elements and events. Google event delegation and eventHandler for further details.

[@iamreg1965]

Google event delegation and eventHandler for much easier ways of controlling DOM events.

[@rupalitanna6046]

very nice tutorial thanks

[@harkcitizens5299]

Thank you very much for this tutorial. Iam french

[@jaepark75]

What text editor are you using?

[@24kKarl]

Is there a simple way to do this for say hundreds of checkboxes? When the box is checked, I want the value for that checkbox to be added to a list. Ty for the video Adam.

[@dragonore2009]

At the school I attend they teach the old DOM methods and still use the dreaded document.write() all the time. I am constantly finding more innovative ways to write my javaScript instead of the crap they teach at school.

[@magnusoliver6086]

I know I am pretty randomly asking but do anybody know of a good place to stream new movies online?

[@kabircameron1818]

@Magnus Oliver Lately I have been using Flixzone. You can find it on google :)

[@marcoalvaro627]

@Kabir Cameron Definitely, I have been watching on FlixZone for since march myself :D

[@magnusoliver6086]

@Kabir Cameron thanks, I signed up and it seems like they got a lot of movies there :D I really appreciate it!!

[@kabircameron1818]

@Magnus Oliver happy to help =)

[@justakidify]

How is it possible for btn1Func to be called on line 7 before it was defined (line 13)?

[@clipoff]

what does the usecaptuer true do? exactly what is captured?

[@ath6192]

Great! Q: Do you have a tutorial for adding the addEventListeners and buttons through an array? :)

[@TakanashiYuuji]

Because of variable 'hoisting'. Function definitions get moved to the top.

[@kamaboko1]

Great tut! Thanks.

[@dubbertrouble]

Really helpful!

[@muhammadkarolia2722]

what app did you use

[@hdjksa52]

Heavy north east accent. thanks for showing the code

[@SandeepKumar-cx3kw]

thanks,, great help

[@Bhuyakasha]

It works pretty well, but when i try to add arguments to the function it will always execute the function, without me clicking on the object.

[@mayue5547]

why window.onload = addListeners? does this line overwrite the window.onload method?

[@AdamSalma]

+Ma Yue Its so that the function only runs after the entire html document has been loaded, otherwise it can bring up errors later on. eg with document.getElementById('myId'): the html element with the id "myId" isn't loaded and so can't be selected in JS

[@TheRandomDestruction]

Thanks 256!

[@andrewrico8321]

are you still on the road?

[@valix85]

How can i register My personal event And fires it? Congratulations forse yours video, i follow You, simply And Clean, perfect for My worst English :)

[@MiddleEasternInAmerica]

thanks million

[@marclaren6193]

WHAT DOES "WINDOW" STAND FOR ??

[@AdamKhoury]

The JavaScript "window" object.

[@js312]

Is it still the right way to do it in 2019?

[@AdamKhoury]

Yes I think so. Anonymous functions can be replaced by arrow functions, if you so desire... that is the only change since this video. But it is not necessary to change all of your anonymous functions to arrow functions.

[@js312]

Do you guys still care about people using ie 8-9 ? @@AdamKhoury , thanks. Also should you really bother writing if else inside addListeners function ? If the users use way out of date technology it should be theirs problem and they should update isin't it ?

[@ionicafardefrica]

As someone accustomed to back end, Java Script/jQuery has always been a pain in the ass. You ALWAYS need a mock up front to demonstrate your work, and most of the time, it needs to be pretty good. Not only you need to know something you consider outside your domain (and kind of boring/trivial and non intuitive), but also something that doesn't have a standard and works on all kinds of spaghetti for four types of browsers. And now it evolves. What the fuck people, can we get standards? Any day now? For example, can we agree if left click event is 0 or 1???

[@das_evoli]

But why false or true?

[@damionreid3164]

This is not the best way to do this. Given that for every "document.getElemen...." you have to add it both in the addEventListener as well as the attachEvent block. Create a function and pass the object, event and handler to it. then depending on whether the attachEvent exists, it either attach the event or adds the event listener

[@benja303]

YELLOWTEXTTOOOBRIGHT

[@codeacademybd]

too much zoom and zoom :(

[@marclaren6193]

THIS VIDEO IS SOOOOO CONFUSING !!!!

[@AdamKhoury]

I'll try to help clarify anything you find confusing. This exercise just shows how to apply event handling through script instead of adding event handling to your html elements directly in the HTML code.