Spec for global variables in Javascript initialized from DOM elements?

Question

In a very common code example when delegating a Javascript event https://javascript.info/event-delegation, I am confused by where the “menu” variable comes from on line 40 in http://plnkr.co/edit/91Q9jINXlue2fXiB0fAY?p=preview . The variable is passed to the constructor, but never initialized. It seems the "menu" variable is automatically created from this div element:

<div id="menu">...</div>
<script>
...
new Menu(menu); /* Who initializes "menu".
...
</script>

I have been doing Javascript for a long time, but it really confuses me. I am also not sure how to generalize this question.

Normally I would do document.getElementById ("menu") to get the div element. Where are these variables initialized and how can I learn more about such variables? Is there a specification?

Answer 1

This variable is automatically generated by the browser and a member of the window element.

The HTML5 standard states that a window object must have a property key whose value is elem if ...

• there is only one element of a DOM element whose property idhas a value key.
• DOM, name . elems : a, applet, area, embed, form, frame, frameset, iframe, img, object.

: https://html.spec.whatwg.org/#named-access-on-the-window-object

Answer 2

id.

<div id="menu">

[ - (WHATWG)]:(https://html.spec.whatwg.org/#named-access-on-the-window-object)

7.3.3 Window

window[name]

.

, , . API, , -, . document.getElementById() document.querySelector().

Answer 3

:

<div id="menu">...</div>

DOM , id. , , .