Question

我注意到当我尝试在窗口对象中检查变量时，javascript将返回与变量名匹配的id的DOM节点。请考虑以下代码：

<html>
<body>
  <div id='hello'>
  </div>
  <script>console.log(window.hello);</script>
</body>
</html>

在此示例中，控制台将输出<div id='hello'>及其任何后代的DOM对象表示。我还观察到覆盖window.hello不会影响DOM，后续操作会显示新的赋值。

有没有办法专门为DOM对象键入检查？或者，有没有办法避免这种行为？虽然并不困难，但在选择命名空间时必须注意页面ID似乎可能会变得非常直观。

Answer 1

某些浏览器会为文档中的每个id值创建一个全局变量。通常，您应该使用：

document.getElementById("hello")

通过id检索DOM元素。

这是你通常应该避免使用全局命名空间的另一个原因，因为它受到浏览器操作的严重污染。

如果你真的想测试某些东西是否是DOM对象，你可以在这里看到它是如何完成的：JavaScript isDOM -- How do you check if a JavaScript Object is a DOM Object?，但是你应该通常不需要为常规的DOM编程目的这样做。

Answer 2

这实际上是HTML5标准：

http://www.whatwg.org/specs/web-apps/current-work/#named-access-on-the-window-object

一种安全的方法是在“命名空间”中创建所有javascript对象和函数：

var objs = {

    someObject: document.getElementById( "someThing" ),

    someFunction: function() {},

    hello: {
        ...
    }
};

//Now you can access it without interfering with the DOM "hello"
console.log( window.objs.hello );

窗口对象属性返回一个dom节点？

2 个答案: