Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Interactive Web Pages with JavaScript Traversing and Manipulating the DOM with JavaScript Perform: Traversing Elements with querySelector

kabir k
PLUS
kabir k
Courses Plus Student 18,036 Points
Posted by kabir k
kabir k
Courses Plus Student 18,036 Points

GlobalEventHandlers

In the code, 

GlobalEventHandlers.onclick

why are we using "GlobalEventHandlers" instead of using just "Element" like this:

Element.querySelector

And how is the "GlobalEventHandlers" different from "Element"?

1 Answer

Marcus Parsons
Marcus Parsons
15,719 Points

Hey Kabir,

The querySelector function actually just grabs a reference to a particular element that you can use to perform other actions on the element. After grabbing that reference, you can then use a global event handler such as onclick (like you do in this project) to execute a function once that event handler has executed on that element. So, these two functions work together to produce interactive content. :)

kabir k
kabir k
Courses Plus Student 18,036 Points
kabir k
kabir k
Courses Plus Student 18,036 Points

I'm not talking about the functions. I meant, how is the GlobalEventHandler different from Element in those two lines of code?

Marcus Parsons
Marcus Parsons
15,719 Points

GlobalEventHandlers is just the group that Mozilla refers to as global event handlers. It is not a specific thing that is used in code.

kabir k
kabir k
Courses Plus Student 18,036 Points
kabir k
kabir k
Courses Plus Student 18,036 Points

Thanks but why is it called GlobalEventHandlers? What is it supposed to be doing?

Marcus Parsons
Marcus Parsons
15,719 Points

From the article https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers at the MDN:

The GlobalEventHandlers interface describes the event handlers common to several interfaces like HTMLElement, Document, Window, or WorkerGlobalScope for Web Workers. Each of these interfaces can implement more event handlers.

GlobalEventHandlers is a raw interface and no object of this type can be created.

Marcus Parsons
Marcus Parsons
15,719 Points

You're welcome, Kabir!