HTML 是一种用于创建网页的标准标记语言，而 JavaScript 是一种脚本语言，用于实现网页的交互功能，在 HTML 中，我们可以使用 <script> 标签来嵌入 JavaScript 代码，为了让 JavaScript 代码在页面加载时自动执行，可以将 JavaScript 代码放在 <body> 标签的底部，或者将 JavaScript 代码放在一个单独的 .js 文件中，并在 HTML 文件中引用该文件。
以下是一些关于如何在 HTML 中自动执行 JavaScript 的方法：
1、将 JavaScript 代码放在 <body> 标签的底部
将 JavaScript 代码放在 <body> 标签的底部，可以确保在页面加载时，JavaScript 代码会按照它们在 HTML 中出现的顺序执行，这种方法适用于较小的 JavaScript 代码片段。
示例：
<!DOCTYPE html>
<html>
<head>
<title>自动执行 JavaScript</title>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<p>这是一个简单的 HTML 页面。</p>
<!-在这里放置 JavaScript 代码 -->
<script>
alert("JavaScript 代码已自动执行！");
</script>
</body>
</html>
2、将 JavaScript 代码放在一个单独的 .js 文件中，并在 HTML 文件中引用该文件
将 JavaScript 代码放在一个单独的 .js 文件中，可以使代码更易于管理和重用，在 HTML 文件中，可以使用 <script src="yourfile.js"></script> 标签来引用该文件，当浏览器加载 HTML 文件时，它会自动加载并执行 .js 文件中的 JavaScript 代码。
示例：
创建一个名为 script.js 的文件，其中包含以下 JavaScript 代码：
alert("JavaScript 代码已自动执行！");
然后在 HTML 文件中引用该文件：
<!DOCTYPE html>
<html>
<head>
<title>自动执行 JavaScript</title>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<p>这是一个简单的 HTML 页面。</p>
<!-在这里引用 JavaScript 文件 -->
<script src="script.js"></script>
</body>
</html>
3、使用事件监听器自动执行 JavaScript 代码
除了将 JavaScript 代码放在 <body> 标签的底部或引用一个单独的 .js 文件外，还可以使用事件监听器来自动执行 JavaScript 代码，事件监听器可以监听特定事件（如点击、滚动等），并在事件发生时执行相应的 JavaScript 代码。
示例：
<!DOCTYPE html>
<html>
<head>
<title>自动执行 JavaScript</title>
<script>
// 使用 addEventListener 方法监听 click 事件
document.addEventListener("click", function() {
alert("JavaScript 代码已自动执行！");
});
</script>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<p>这是一个简单的 HTML 页面。</p>
</body>
</html>
在这个示例中，我们使用 addEventListener 方法监听了 click 事件，当用户点击页面上的任何元素时，都会弹出一个警告框，显示 "JavaScript 代码已自动执行！"。
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/362982.html
微信扫一扫