我可以使用 HTML 元素的 id 作为 JavaScript 中的变量吗？ [复制]

Question

意外地，我注意到我可以在 JavaScript 代码中使用 HTML 元素的 id。所以不要这样：

var myCanvas = document.getElementById('myCanvas');
myCanvas.width = '600';
myCanvas.height = '400';

我什至连第一行都没有，因为变量myCanvas 显然已经存在！

myCanvas.width = '600';
myCanvas.height = '400';

这很好，但我可以依赖它吗？这是我在所有现代浏览器中都可以期待的正常行为吗？我不关心IE9之前的任何浏览器。

Answer 1

在浏览器脚本的早期，IE 将 ID 和 NAME 属性值变成了引用相关元素的全局对象的属性。这被广泛认为是“坏事”，但被大多数其他浏览器复制以与 IE 兼容（当时大多数网站几乎都是专门为 IE 编写的，拥有大约 95% 的用户份额）。

随后出现了开放标准并齐心协力支持它们。现在没有任何人使用它，尽管它可能仍然被所有正在使用的浏览器支持。

请注意，已声明的同名全局变量优先于同名或 ID 元素。

Answer 2

我将向您推荐这个answer，并提到这是不是 standard behaviour。所有浏览器都支持这种行为（在怪癖模式之外没有 Firefox），但我不建议使用它。 firefox<14 在标准模式下不支持此功能

Answer 3

您可以信赖它。但如果运行站点的语言是 ASP.NET，则使用 ClientID 会更安全。如果控件的 ID 发生变化，你的代码也会随之改变。

例如对于在 ASP.NET 上运行的 Javascript

var myCanvas = document.getElementById("<%=myCanvas.ClientID%>");