Menu
I was looking at google.com source and saw:<!doctype html><html onmousemove="google&&google.fade&&google.fade(event)">
I did not know the HTML tag could accept event listeners. What is the difference of placing the event listener on the HTML tag versus the BODY tag? Is there any difference in the event bubbling?
236
Note: Event handlers are sometimes called event listeners — they are pretty much interchangeable for our purposes, although strictly speaking, they work together. The listener listens out for the event happening, and the handler is the code that is run in response to it happening.
addEventListener can add multiple events to a particular element. onclick can add only a single event to an element. It is basically a property, so gets overwritten.
The addEventListener() method attaches an event handler to an element without overwriting existing event handlers. You can add many event handlers to one element. You can add many event handlers of the same type to one element, i.e two "click" events.
I saw this a couple of days ago and didn't give it much thought. But one reason could be "performance" as it always is with Google :)
For an extremely slow client, <html> will be parsed first thing and the onmousemove handler will be ready to fire if the user moves the mouse. If there is too much content inside <head>, this may be more preferable as the onclick on <body> may take a little while to register as all that head content has to be downloaded and parsed first.
Actually that is already happening, there is approximately 2KB of content before <body> appears.
91
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
