3

看看这个小提琴（下面的部分代码片段）：http: //jsfiddle.net/QJJb8/

<button id='mybutton'>MY BUTTON</button>

mybutton.addEventListener('click', mybuttonClick, false);

function mybuttonClick(e){
    alert(e.target.textContent+' WAS CLICKED!');
}

请注意我没有使用 getElementById() 来获取对按钮的引用。为什么它仍然有效？（在 Firefox、Chrome 和 IE9 & 10 中测试。）

是不好的做法/怪癖，还是按钮元素的内置功能？如果是后者，那么在使用按钮元素时这是一个很棒的特权/捷径！或者也许我一直在过度使用 getElementById() ？

//回答更新////////////////////////////////////// //////////////////////

经过一些研究，似乎上面讨论的行为实际上是 HTML5 规范的一部分。除了下面 RobG 的回答之外，另请参阅以下链接以获取更多信息：

http://tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/

https://stackoverflow.com/a/3434388/2434324（链接由 yoelp 提供）

http://jsperf.com/named-access-on-the-window-object

4

2 回答 2

2

因为早在浏览器脚本开始时，IE 就决定让元素名称和 ID 成为引用该元素的全局变量。其他人都认为这是一个坏主意（确实如此）并且没有这样做。

然而，IE 占据了大约 95% 的浏览器市场，开发人员为 IE 的怪癖而开发，因此其他浏览器实现了相同的行为但没有宣传它（支持document.all也是如此）。所以现在所有的浏览器都这样做了，但是（几乎）没有人使用它。

除非有人偶然发现它……</p>

所以你在哪里：

<button id='mybutton' ...>

browsers create a global mybutton variable that references the element.

于 2013-05-29T22:31:47.763 回答
1

This works on all DOM elements, not only buttons, Its probably a bad practice since any one may change mybutton to something else (ie.mybutton = "BLABLA") then your code breaks

also see this

于 2013-05-29T22:39:54.610 回答