3

这是我提醒我标签数量childNodes的功能。body

    function countBodyChildren() {
      var body_element = document.getElementsByTagName("body")[0];
      alert(body_element.childNodes.length);
}

 window.onload = countBodyChildren;

该函数运行良好，但是当我添加()到函数名称的末尾时，即window.onload = countBodyChildren();该函数没有运行。为什么是这样？我想调用函数，即使它们不需要任何参数，你总是在()其名称的末尾添加。

4

3 回答 3

9

我想调用函数，即使它们不需要任何参数，你总是将 () 添加到其名称的末尾。

你想的没错。但是在这里，您不想调用该函数；您想告诉浏览器在时机成熟时调用哪个函数。

添加括号时，您将立即调用该函数（而不是在加载时）。函数执行；尝试查找body元素，但尚未加载；所以你body_element最终成为undefined. 你抬头看childNodes，undefined并得到一个错误。window.onload分配不会发生。

即使您的函数没有抛出错误，它也会返回undefined，因此window.onload变成undefined，因此最终加载页面时不会发生任何事情。

相反，您需要开始认为函数只是另一种价值。当你说

function a() {
  // ...
}

与此相同：

a = function() {
  // ...
};

（实际上是有区别的，重要的，但它们现在无关紧要；当你掌握了基础知识时，请查看它们）。一个函数现在“包含”在变量中a。然后你可以这样做：

var b = a;
b();

它会起作用 - 你将a（你的函数）中的任何内容放入变量b中，然后通过调用它的新名称来执行它（因为现在两者都a引用b同一个函数）。同理，之后

window.onload = countBodyChildren;

对象的onload属性window现在包含您的函数。加载完成后，浏览器将执行任何内容。

你有过早执行的案例。

于 2012-06-22T15:19:03.223 回答
1

期望的是window.onload对函数或函数定义的引用。

当你放括号时，你实际上执行了函数，它是分配给的函数的返回值window.onload。

于 2012-06-22T15:19:49.243 回答
1

window.onload = countBodyChildren();

这就是说“调用函数，并将函数的返回值分配给窗口对象的 onload 属性。你的函数什么都不返回。

例如

function countBodyChildren() {
      var body_element = document.getElementsByTagName("body")[0];
      alert(body_element.childNodes.length);
return 5;
}
window.onload = countBodyChildren();

这会将 5 分配给 onload 道具。不是你想要的。你需要给onload prop分配一个函数引用，这样js引擎才能在事件发生时调用该函数。

于 2012-06-22T15:21:18.663 回答