为什么即使javascript代码中没有定义对象，此代码也能正常工作？

Question

我正在使用JSLint并且它说： 'matte_canvas'未定义。 显然，在我的javascript代码中我没有定义'matte_canvas'，但是，它确实在控制台中输出canvas元素。

这是我的代码：

HTML：

<canvas id="matte_canvas" width="50" height="50" style="background-color:blue;"></canvas>

使用Javascript：

console.log(matte_canvas);

这是JSFiddle：http://jsfiddle.net/allisonc/rqo5a417/

有人可以向我解释它是如何运作的吗？

Answer 1

id也是全局变量（如果没有为其分配其他值）。 不要依赖于此。
这也适用于某些元素的name属性：a，applet，area，embed，form，frameset ，img和object。

alert(window.matte_canvas);

更多信息：https://html.spec.whatwg.org/#named-access-on-the-window-object