加载页面后，要添加什么事件侦听器来执行一段代码?

Question

我有一个单独的Javascript，在标签下的相关html中提到。在Javascript文件中，我编写了一段代码，直到现在，当我单击按钮时才执行该代码。代码如下所示:

document.getElementById('destination').addEventListener('submit', (event) => {//my code here});

这里的'destination'是文本框的名称。然而，我想删除这个文本框和按钮并执行这段代码，如:

document.addEventListener('load', (event) => {//my code here});

我甚至尝试在不添加要同步执行的事件侦听器的情况下执行代码。但我得到一些错误这样做。

Answer 1

你是否可以这样写:

window.onload = () => {
//your code to run here
}

这就是我处理页面加载事件的方式。

Answer 2

load事件仅在Window上可用，在Document上不可用。您可能正在寻找的是DOMContentLoaded事件，该事件在页面被完全解析后立即触发。

document.addEventListener('DOMContentLoaded', e => { // your code here });

使用load事件，如果你想等待所有的外部资源，如图像，样式表等先完成加载。

window..addEventListener('load', e => { // your code here });

您也可以使用onload属性附加侦听器。

window.onload = e => { // your code here };