“Hello, World!” 通常是一个程序员在学习新编程语言时编写的第一个程序。JavaScript “Hello World” 是一个简单的程序,通常用来演示语言的基本语法。这个程序将使用不同的 JavaScript 方法来打印 “Hello World”。
使用 document.write()
在 JavaScript 中,最简单的打印 “Hello World” 的方法是使用 document.write()
方法。document.write()
方法直接将内容(一段文本)写入 HTML 文档或网页。让我们看看下面的例子:
<script>
document.write("Hello World");
</script>
我们应该在 <script>
和 </script>
标签之间写入 document.write()
。我们可以把 <script>
放在 <head>
或 <body>
部分中。
示例
让我们尝试编写一个 JavaScript 程序,它将 “Hello World!” 打印到文档或网页上。在下面的程序中,我们在 <head>
部分内放置了 JavaScript 代码。你可以尝试把 JavaScript 部分放在 <body>
部分内并运行程序。
<html>
<head>
<script>
document.write("Hello World");
</script>
</head>
<body>
</body>
</html>
使用 alert()
方法
我们可以使用窗口 alert()
方法将 “Hello World” 打印在一个对话框中。
alert()
是一个窗口方法,指示浏览器显示带有消息的警告框。我们可以不传递任何消息就写 alert
。
<script>
alert("Hello World");
</script>
我们可以将 alert()
方法写为 window.alert()
。由于 window 对象是一个全局作用域的对象,我们可以省略 “window” 关键字。
示例
让我们尝试一个例子,在警报框中显示 “Hello World”。尝试通过将 <script>
部分放在 <body>
部分内来执行程序。
<html>
<head>
<script>
alert("Hello World");
</script>
</head>
<body>
</body>
</html>
使用 console.log()
console.log()
是一个非常方便的方法,可以将消息打印到 Web 控制台。这对于在浏览器中调试 JavaScript 代码非常有用。让我们看看 console.log()
的简单应用,以将 “Hello World” 打印到 Web 控制台。
<script>
console.log("Hello World");
</script>
我们可以使用 console.log
来打印字符串或 JavaScript 对象。在上面的代码片段中,我们将 “Hello World” 作为一个字符串参数传递给了 console.log()
方法。
示例
让我们尝试编写一个完整的带有 HTML 的 JavaScript 程序。
<html>
<head>
<script>
console.log("Hello World");
</script>
</head>
<body>
<p> 请在点击 “Edit & Run” 按钮前打开控制台 </p>
</body>
</html>
这将在 Web 控制台中产生以下消息:
Hello World
使用 innerHTML
innerHTML
属性定义了 HTML 元素的内容。我们可以使用此属性来显示 “Hello World” 消息。通过更改元素的 innerHTML
属性,我们可以在 HTML 文档或网页中显示消息。
要使用元素的 innerHTML
属性,我们需要先访问该元素。我们可以使用 document.getElementById()
方法来访问元素。让我们看一个完整的例子。
示例
在下面的例子中,我们定义了一个具有 id “output” 的 div 元素。我们使用 document.getElementById("output")
来访问这个元素。然后我们更改 innerHTML
属性并显示我们的消息 “Hello World”。
<html>
<head>
<title>使用 `innerHTML` 属性</title>
</head>
<body>
<div id = "output"> </div>
<script>
document.getElementById("output").innerHTML = "Hello World";
</script>
</body>
</html>