“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>