Javascript中的window.onload

在Javascript中，window.onload被用来指定在页面（或框架）完全加载后要运行的函数。当页面中所有元素（包括图像、CSS和Javascript文件等）都已加载完成时，window.onload事件就会被触发。

使用方法

使用window.onload的最简单方式是将一个函数分配给它：

window.onload = function() {
  // 代码
};

这意味着在页面完全加载后运行相应的代码。您也可以将函数分配给window.onload，如下所示：

function myInitFunction() {
  // 代码
}

window.onload = myInitFunction;

这两种方法都会在页面加载成功后运行相应代码块。然而，后一个选项更好，因为它使代码更清晰易懂。

使用window.onload的更为强大的方法是将不止一个函数分配给它。这与将事件处理程序附加到HTML元素上非常相似。如果多个函数被分配给window.onload，它们将按照它们被分配的顺序执行。

function myInitFunction() {
  // 代码
}

function mySecondFunction() {
  // 代码
}

window.onload = function() {
  myInitFunction();
  mySecondFunction();
};

示例

下面的示例演示如何在window.onload事件上附加多个函数，并在每个函数执行时向控制台输出一条消息。

function myInitFunction() {
  console.log("初始化函数成功运行");
}

function mySecondFunction() {
  console.log("第二个函数成功运行");
}

window.onload = function() {
  myInitFunction();
  mySecondFunction();
};

当页面完全加载后，将在控制台中看到如下所示的输出：

初始化函数成功运行
第二个函数成功运行

结论

在Javascript中，window.onload是一个非常有用的工具，它允许您指定在页面完全加载后运行的Javascript代码。无论您是要运行一个还是多个函数，使用window.onload能够确保这些函数在页面准备好之后运行。