In JavaScript, the classic "Hello, world!" program is a fundamental example that outputs the text Hello, world! to the console. Due to its simplicity, this program is frequently employed as an introductory exercise for newcomers to a programming language.
In this tutorial, we will create our initial JavaScript program.
JavaScript Program to Print- Hello, World!
There are three ways to print 'Hello, World!'.
- document.write
- alert
- console.log
Using document.write
The function document.write allows you to output content directly into an HTML document when you need to display information.
Example
//Program to print Hello, World!
document.write('Hello, World!');
Output:
Hello, World!
Explanation
In this illustration, the document.write function is utilized to display the message Hello, World! in the web browser.
Using alert
In JavaScript, the alert function is employed to present an alert box that overlays the current window, showcasing the designated message.
Example
//program to print Hello, World!
alert('Hello, World!');
Output:
Hello, World!
Explanation
In this snippet, the statement alert('Hello, World!') is a JavaScript instruction that triggers a pop-up window containing the text "Hello, World!".
Using console.log
In JavaScript, the function console.log serves the purpose of outputting messages to the web console.
Example
//program to print Hello, World!
console.log('Hello, World!');
Output:
Hello, World!
Explanation
In the provided code, the statement console.log('Hello, World!') outputs the text Hello, World! to the console.
3 Places to Put JavaScript Code
JavaScript code can be placed between three main locations within in webpage.
- Within the body tag of HTML
- Within the head tag of HTML
- External JavaScript (in .js file)
Within the body tag of HTML
By positioning the JavaScript code inside the body tag of an HTML document, we guarantee that the content of the page is fully loaded prior to the execution of the script.
Example
<body>
<script>
alert("Hello, World!");
</script>
</body>
Within the head tag of HTML
This approach executes the script prior to the loading of the page content, potentially causing a delay in rendering.
Example
<head>
<script>
alert("Hello, World!");
</script>
</head>
External JavaScript
External JavaScript refers to the practice of composing a JavaScript program within a file that has a .js file extension. In simpler terms, this means that JavaScript code can be developed and stored in separate files that utilize the .js extension.
Within HTML documents, the incorporation of <script> tags enables us to link external JavaScript files. The src attribute is utilized to specify the location and name of the file that we intend to embed in our HTML page.
Example
<html>
<head>
<title>Example of external javascript</title>
<script src = "https://placehold.co/400x300/1abc9c/ffffff?text=Sample+Image"></script>
</head>
<body>
</body>
</html>
Script.js File
document.write('Hello, World!');
Output:
Hello, World!
Hello World JavaScript Program - FAQs
What is the Hello World function?
You have the ability to create a function that outputs the string "Hello World" to your browser's console. Additionally, you can establish analogous functions to gain greater control over console logging and facilitate debugging processes.
What is the syntax to print Hello World?
The primary method for outputting content to the browser console is through the console.log function. Additionally, JavaScript provides two other functions for displaying information: document.write and alert.
What is External JavaScript?
External JavaScript refers to the practice of developing a JavaScript program within a file that carries a .js extension. In simpler terms, JavaScript code can be authored in separate files that have the .js extension.