为啥 input标签 设置id后 就可以直接通过id获取input,可以不通过document获取标签

为啥 input标签 设置id后 就可以直接通过id获取input,可以不通过document获取标签

【 不理解: 为什么没有 document.getElementById("ipt") 就可以赋值呢?】

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <input type="text" id="ipt">
    <p id="op"></p>
    <script>
        let obj = {
            txtVal: '输入框的默认值',
            name: '李四'
        }

        let newObj = new Proxy(obj, {
            get(target, property) {
                console.log("target", target);
                console.log("property", property);
                return target[property]
            }
        })
        console.log(newObj.txtVal);

        ipt.value = newObj.txtVal // 不理解: 为什么没有 document.getElementById("ipt")  就可以赋值呢?
        op.innerHTML = newObj.txtVal
        addEventListener('input', (e) => {
            console.log(e.target.value);
            op.innerHTML = e.target.value
        })
    </script>
</body>

</html>

元素设置了 id 属性,会挂在 window 上,成为全局属性。所以 document.getElementById 没有也能直接访问。