使用window.onload时，GetElementById返回null，但在控制台运行时不会返回null。

Question

我正在尝试通过id在我的网站中找到一个div，但当我从window.onload调用getElementById时，返回null。我已经确认我要查找的元素存在，并且它没有与任何其他元素共享Id。

奇怪的是，当我从Chrome的开发者工具运行控制台命令时，div会像应该返回一样。

我提供了一个简化版本的JSFiddle链接和我正在尝试的简短显示，并欢迎您优秀的人们提供任何意见。

<script>
    var hasElement = document.getElementById('someId');
    alert(hasElement);
</script>
<div id="someId">true</div>

http://jsfiddle.net/ph9Nc/2/

- user2543321

---

您在 fiddle 中使用了 window.onload=urlFinder()，这将 onload 的值设置为 urlFinder 函数的返回值，而不是函数本身。如果您想在 onload 事件中运行 JavaScript，请确保它在 window.onload 函数内部调用。同时请注意，您的 fiddle 已经设置好在 onload 事件中执行 JavaScript，可以在 jsfiddle 网站左侧的设置中查看。 - Patrick Evans

应将window.onload=urlFinder();改为window.onload=urlFinder;。你不想调用函数，只需要设置它即可，无需修改原意。 - gen_Eric

Answer 1

问题在于您需要更改这个：

window.onload=urlFinder();

转换为：

window.onload=urlFinder;

或者你可以在相关HTML代码的</body>标签前调用你的函数。

你之前是立即调用函数然后将返回结果赋给window.onload，而不是将函数引用分配给window.onload。请记住，任何时候使用()，都表示立即执行。每当你只分配函数名称时，那就意味着分配一个对该函数的引用，以便稍后在它们选择将()应用于变量时由某个人调用。

此外，你的jsFiddle不是有效的测试，因为整个fiddle都设置为等待window.onload触发（位于左上角），这可能只会让你更加困惑。

下面是已修复的jsFiddle版本（你的一些代码中也存在JS错误）：http://jsfiddle.net/jfriend00/3H9vu/

- jfriend00

---

感谢您修复了这个问题，并让我明白了window.onload的真正功能。结果证明，我只需要在页脚调用函数而不是页眉就可以解决问题了。 - user2543321

Answer 2

您正在尝试获取的DOM元素尚不存在

在将 div 写入页面之前，您正在尝试获取它。除非您明确告诉脚本标签等待，否则它会立即执行。

您有两个选项：

在HTML后放置脚本

<div id="someId">true</div>
<script>
    var hasElement = document.getElementById('someId');
    alert(hasElement);
</script>

告诉脚本在加载事件上执行

使用基本的Javascript...

<script>
window.onload = function(){
    var hasElement = document.getElementById('someId');
    alert(hasElement);
}
</script>
<div id="someId">true</div>

...or with jQuery...

<script>
$(document).ready(function(){
    var hasElement = $('#someId');
    alert(hasElement);
});
</script>
<div id="someId">true</div>

更新:

或者，在大多数现代浏览器中，您可以在脚本标记上使用async或defer属性，以避免默认的同步阻塞行为。

关于控制台:

控制台将记录对象在其最后状态的引用，而不是在脚本调用时的状态。有关说明，请参见此帖子：https://dev59.com/M2s05IYBdhLWcg3wLfEj#7389177

- gfullam

---

实际上，这正是我正在寻找的。我仍然需要在window.onload上运行该函数，但我遇到的问题是当它运行时div还不存在。感谢大家的协助。 - user2543321