简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

How to Print \'Hello, World!\' in JavaScript

DDD
Release： 2024-09-18 11:54:02
Original
462 people have browsed it

Welcome to another installment of our JavaScript journey! In this blog post, we'll cover one of the most fundamental tasks in programming: printing "Hello, World!" to the screen. This simple exercise is a great way to get started with JavaScript and understand the basics of how the language works. Let's dive in!

Printing "Hello, World!" in JavaScript

Printing "Hello, World!" is a classic example used to introduce new programming languages. In JavaScript, you can achieve this in several ways, depending on the environment you're working in. We'll cover the most common methods: using the browser console and displaying the message on a web page.

Method 1: Using the Browser Console

The browser console is a powerful tool for testing and debugging JavaScript code. You can access the console in most modern web browsers by pressing F12 or Ctrl Shift I (Windows/Linux) or Cmd Opt I (Mac).

Steps:

  1. Open your web browser and press F12 or Ctrl Shift I (Windows/Linux) or Cmd Opt I (Mac) to open the developer tools.
  2. Navigate to the "Console" tab.
  3. Type the following JavaScript code and press Enter: 
console.log("Hello, World!");
Copy after login

Explanation:

  • console.log() is a built-in JavaScript function that outputs a message to the browser console.
  • The string "Hello, World!" is the message you want to display.

Method 2: Displaying on a Web Page

If you want to display "Hello, World!" on a web page, you'll need to write some HTML and JavaScript code. Here's how you can do it:

Steps:

  1. Create a new HTML file (e.g., index.html).
  2. Open the file in a text editor and add the following code: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hello, World!</title>
</head>
<body>
    <h1 id="message"></h1>

    <script>
        document.getElementById("message").innerText = "Hello, World!";
    </script>
</body>
</html>
Copy after login

Explanation:

  • The  declaration defines the document type and version of HTML.
  • The  element is the root element of the HTML document.
  • The  element contains meta-information about the document, such as the character set and title.
  • The  element contains the content of the web page.
  • The 

     element with the id attribute message is where the "Hello, World!" message will be displayed.

  • The 
    Popular Tutorials
    More>
    Related Tutorials
    Popular Recommendations
    Latest courses
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！