javascript - Chrome console.log(elementID) 输出控制台中的元素

Question

<input type="text" placeholder="Password" id="password" name="password" />
<script>
    console.log(password);
</script>

上面的代码在控制台中输出以下内容：

<input type="text" placeholder="Password" id="password" name="password">

当我输出一个变量password并注意到 HTML 已添加时，我注意到了这一点。这是正常的行为吗？getElementById在那种情况下，我们有什么用？

Answer 1

window[element id]使用或获取元素window[element name] 是自 Firefox 14 以来所有现代浏览器实现的标准行为。我将向您推荐有关该主题的一些帖子。正如您在大多数有关此事的帖子中所发现的那样，不建议使用该行为，并且通常会因为浏览器优化并检查变量是 id 还是 name 是全局范围内的最低优先级而变慢。.getElementById

• 带有 id 的 DOM 树元素会成为全局变量吗？
• 我可以使用 HTML 元素的 id 作为 JavaScript 中的变量吗？

Answer 2

传统行为是将所有具有 ID（和名称，我认为）的元素定义为window. 因此，window.password（或只是password）理论上可以用作getElementById. 但是，一旦您定义了具有相同名称的变量，您就会得到不可预测的行为。

这是全局变量不好的原因之一。始终使用var.