jquery - Javascript Event handling history -

jquery - Javascript Event handling history -

while understand javascript event handling in bits , pieces, wanted understand finish history behind it, how event handling implemented (may using within markup <a onclick="callfunc()"> )

and how later got updated else calling js (unobtrusive js)

to how implemented using jquery ?

i wanted understand advantages @ each stage , things event bubbling/capturing, etc

well, there's not much it. or, really, there happened long time ago.

.addeventlistener has been around long css has. that's how long dom-level2 has been (~13 years, think).

it wasn't question of how js got more advanced, question of how js-writers didn't.

programmers know, write js "secondary" or "tertiary" role still utilize inline-handlers. it's been more decade since particularly idea.

as "unobtrusive", that's not related straight event-listeners. is, if intend interact user in way, it's more question of separating concerns, same way no longer style elements <p><font color=red>red text</font></p>.

perhaps part of reason dom-0 event-handlers (like button.onclick = function () {}) have hung around long, , still see frequent use, because of war between microsoft's attachevent , w3c's addeventlistener.

if want back upwards cross-browser events in ie6-8, you're either using jquery (or library), you're writing event-management functions hand, back upwards both .attachevent ie , .addeventlistener else, or you're using event-properties straight (.onclick = function () {}). have benefit of beingness supported practically every single browser in utilize today. have detriment of having 1 assignable function (which leads ugly handling if need add together more of them):

(function () { var button = document.getelementbyid("button"), old_func = button.onclick; button.onclick = function (e) { e = e || window.event; dostuff(); if (old_func) { old_func(); } } }());

...now imagine 8 different programmers adding listeners same button way.

as bubbling versus capture... never battle (post-netscape). microsoft supported bubble, w3c supports both. nobody uses capture anything, because there few times want know event before happens, , before target knows it's happening (and because way utilize capture using addeventlistener, means event won't work on ie...)

what jquery brought table wasn't "new" events or "better" events -- did allowed cross-browser events programmed everyone. lot of ajax libraries had primary goal: normalize differences between addeventlistener , attachevent (which solved problem, before jquery), , between xmlhttprequest , activexobject("msxml2.xmlhttp.6.0"), (again, solved pre-jquery).

jquery has been crowd-favourite, , resig has done stuff (while jquery users have done horrible stuff it, forcing resig , friends super-human idiot-proof dom-traversal , event-delegation , rest).

some of have gotten improve event-delegation, , like, on past ~6 years, people douglas crockford , nicholas zakas took reigns of social-sphere, writing books , great talks on professional, high-performance js.

and on past few years, more people have stepped design patterns seen in other languages see enterprise-use.

things promises/deferreds/futures ($.deferred/$.when) future of js-engineering, when talking client-side asynchronous programming web-apps.

that's not it'll 100% today, keeping dom events straight solved problem -- keeping them in-line of async stuff might happen @ time, in widget on page... ...that's promises come in handy.

then have moderators/observers keeping inter-module communication safe , decoupled. these might "custom-events", or might "emitters"... ...or "publisher/subscribers". things can hear , deed on. might triggered actual browser-events, or might triggered in code.

again, jquery didn't invent or perfect this, event subscribe in jquery doing 1 of these things under hood.

same $.ajax -- it's not using dom events, it's passing promises around, can subscribe to. dom events uses ones retrieve info server. after that, it's custom.

in lastly few years, we've made huge leaps in terms of js can do, , how handle interaction , asynchronicity.

little of has had advances in how addeventlistener has gotten better, or how jquery helped bridge gap between ie8 , rest of browsers.

javascript jquery html dom