📌  相关文章
📜  页面加载后 Javascript 运行代码 - Javascript (1)

📅  最后修改于: 2023-12-03 14:58:44.905000             🧑  作者: Mango

页面加载后 Javascript 运行代码 - Javascript

Javascript 是一种客户端脚本语言，它可以在网页加载后运行，为用户提供交互体验。本文将介绍如何在页面加载后运行 Javascript 代码。

在 HTML 页面中添加 Javascript 代码

要运行 Javascript 代码，我们首先需要将它添加到 HTML 页面中。在页面的 <head> 或 <body> 部分，可以使用 <script> 标签来引入 Javascript 代码库或文件。例如：

<!DOCTYPE html>
<html>
  <head>
    <title>我的页面</title>
  </head>
  <body>
    <h1>我的页面</h1>
    <p>这是我的页面内容。</p>
    <script>
      alert('欢迎访问我的页面！');
    </script>
  </body>
</html>

在这个例子中，我们在 <script> 标签内添加了一行代码：alert('欢迎访问我的页面！'); 。这行代码将弹出一个对话框，显示欢迎信息。

在页面加载后运行 Javascript 代码

如果我们希望在页面加载后自动运行 Javascript 代码，可以使用 <body> 标签的 onload 事件。此事件将在页面加载完毕后触发。例如：

<!DOCTYPE html>
<html>
  <head>
    <title>我的页面</title>
  </head>
  <body onload="runOnLoad()">
    <h1>我的页面</h1>
    <p>这是我的页面内容。</p>
    <script>
      function runOnLoad() {
        alert('欢迎访问我的页面！');
      }
    </script>
  </body>
</html>

在这个例子中，我们添加了一个 onload 属性到 <body> 标签，它的值为 runOnLoad() 。我们还创建了一个名为 runOnLoad() 的 Javascript 函数，该函数在页面加载后将显示欢迎信息。

小结

通过在 HTML 页面中添加 <script> 标签，我们可以向用户提供交互体验。通过使用 onload 事件，我们可以在页面加载后自动运行 Javascript 代码。这些技术可以帮助我们创建更灵活和交互性更好的网页。