数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在 HTML 中元素加载完成后执行脚本？
在这篇文章中，我们将学习如何在 HTML 中元素加载完成后执行脚本。
当对象加载完成后，就会发生 onload 事件。onload 最常用于 <body> 元素 中，以便在网页完全加载其所有内容后运行脚本。这可以用于许多事情，例如检查 Cookie 或根据用户的浏览器设置页面的适当版本。
让我们深入了解本文，以更深入地了解如何在 HTML 中元素加载完成后执行脚本。
使用 Onload 方法
元素加载完成后，就会发生 onload 事件。要执行网页完全加载后的脚本，请将其与 body 元素一起使用。
语法
以下是 onload 方法的语法。
<body onload="functionToBeExecuted">
示例
在以下示例中，我们使用 onload 方法。
<!DOCTYPE html>
<html>
<body onload="loadFunction()">
<h1>Welcome To TutorialsPoint</h1>
<script>
function loadFunction() {
alert("Loaded Successfully");
}
</script>
</body>
</html>
当脚本执行时，事件会被触发，并在网页上显示一个警报“加载成功”。
如果用户点击“确定”，页面将成功加载并显示文本“欢迎来到 tutorialspoint”。
使用 window.onload 方法
window 元素的 onload 属性用于在网页完全加载后执行脚本。网页加载后，onload 属性会激活该函数。
语法
以下是 window.onload 方法的语法。
window.onload = function exampleFunction() {
// Function to be executed
}
示例
考虑以下示例，我们使用 window.onload 方法。
<!DOCTYPE html>
<html>
<body>
<h1>The Best E-Way Learning.</h1>
<script>
function loadFunction() {
alert("Window Loaded Successfully");
}
window.onload = loadFunction();
</script>
</body>
</html>
运行上述脚本后，输出窗口会弹出，并在网页上触发事件时显示警报“窗口加载成功”。
当用户点击“确定”时，窗口将成功加载并在网页上显示文本“最佳在线学习方式”。
更新于： 2023年11月22日
2K+ 阅读量
广告