为何JS中globalThis.num1能获取到未正确查询的DOM元素值？
2026-7-22
问题原因解析
这是浏览器的历史遗留特性搞的鬼：页面里所有带id的DOM元素，都会被自动挂到全局对象（globalThis）上，属性名就是元素的id值，就算开了严格模式，这个特性照样生效。
你的情况里，输入框id是num1，所以浏览器自动把这个元素绑到了globalThis.num1上。而你自己定义的num1变量，如果是用let或const声明的——哪怕是在全局作用域——严格模式下这类声明的全局变量并不会成为globalThis的属性。你以为自己的num1和globalThis.num1是同一个东西，但其实完全是两码事：你通过document.getElementById('number1')拿到的null是自己声明的那个num1的值，而globalThis.num1是浏览器自动挂载的输入框元素。
如果是用var声明的全局num1，var声明的变量确实会成为globalThis的属性，但要是你的脚本是在DOM加载完成前执行的（比如放在<head>里），那你先把var num1赋值成null，等DOM加载完浏览器又自动把globalThis.num1改成了输入框元素——因为var声明的全局属性是可写的，所以会被覆盖，最后globalThis.num1就变成了输入框。
核心就是两种情况：
- 用
let/const声明全局num1：自己的变量和globalThis.num1是两个独立的东西，后者是浏览器自动加的DOM元素。 - 用
var且脚本跑在DOM加载前：先赋值null，后被浏览器自动挂载的元素覆盖。
内容的提问来源于stack exchange，提问作者john
相关产品推荐
相关产品推荐
