你的第一个 JavaScript 实验

JavaScriptBeginner
立即练习

介绍

你好,欢迎来到 LabEx!在第一个实验中,你将学习经典的 JavaScript "Hello, World!" 程序。

点击下方的 继续 按钮开始实验。

这是一个实验(Guided Lab),提供逐步指导来帮助你学习和实践。请仔细按照说明完成每个步骤,获得实际操作经验。根据历史数据,这是一个 中级 级别的实验,完成率为 72%。获得了学习者 99% 的好评率。

Hello JavaScript

JavaScript 是一种编程语言,允许你为网站添加交互性。它用于创建动态、交互式的网页。它是一种具有面向对象能力的解释型编程语言。

我们将使用 JavaScript 创建一个简单的网页,当点击按钮时显示一条消息。

index.html 已在 WebIDE 中创建。打开它并添加以下代码:

<!doctype html>
<html>
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    <h1 id="message">点击按钮以显示消息!</h1>

    <button onclick="displayMessage()">点击我</button>

    <script>
      function displayMessage() {
        document.getElementById("message").textContent = "Hello, JavaScript!";
      }
    </script>
  </body>
</html>

上述代码将在点击按钮时显示一条消息。消息显示在 id 为 messageh1 元素中。

onclick 属性用于在点击按钮时调用 displayMessage() 函数。displayMessage() 函数会将 h1 元素的文本内容更改为 "Hello, JavaScript!"。

交互式按钮的 HTML 代码

然后点击右下角的 Go Live 按钮,这将在 8080 端口上运行一个本地 Web 服务器。

现在,你可以切换到 Web 8080 标签页,并点击刷新按钮以查看更改。

显示 Hello JavaScript 的网页

总结

恭喜!你已经完成了你的第一个 LabEx 实验。

如果你想了解更多关于 LabEx 以及如何使用它的信息,可以访问我们的 支持中心。或者你可以观看 视频 以了解更多关于 LabEx 的内容。

编程是一段漫长的旅程,但 下一个实验 只需点击一下即可开始。让我们继续吧!