Learn JavaScript

JavaScript Code Placement

You can place a JavaScript code mainly in two places first one is the on page JavaScript Code Placement and the next is the external JavaScript code placement. Here we will be discussing both methods to understand how we can write a JavaScript code on an HTML file / pages.

On Page JavaScript Code Placement

On page JavaScript code placement can be done by writing the JavaScript / Script in:

  • <head>…</head> section.
  • <body>…</body> section.
  • <head>…</head> and <body>…</body> sections.

<head>…</head> JavaScript Code Placement

In order to run on an event such as user clicks, we can place the JavaScript code in <head>…</head> section like:

Code Snippet

<html>
<head>
<script>
document.write(2 + 3);
</script>
</head>
<body>
statement 1;
statement 2;
.
.
.
statement n;
</body>
</html>

<body>…</body> JavaScript Code Placement

If you want a JavaScript code runs immediately when the page loads, so that the JavaScript code can generate some content on that page, then that JavaScript code must be written in <body>…</body> section. In this case you don’t need to defined any function using the JavaScript.

Code Snippet

<html>
<head>
</head>
<body>
<script>
document.write("Hello Dear User");
<p>The sum of 2 and 3 is 5</p>
</script>
</body>
</html>

Output

Hello Dear User

The sum of 2 and 3 is 5


<body> and <head> JavaScript Code Placement

In JavaScript you have liberty to write the JavaScript code within the <body>…</body> and <head>…</head> sections as follows:

Code Snippet

<html>
<head>
<script>
console.log("Hello Dear User");
</script>
</head>
<body>
<script>
document.write("What is the Sum of 2 and 3");
<p>The sum of 2 and 3 is 5</p>
</script>
</body>
</html>

Output

Hello Dear User
What is the Sum of 2 and 3

The sum of 2 and 3 is 5


External JavaScript Code Placement

In JavaScript programming language, the script tag allows you to write your JavaScript code in any external file and, then you can include that JavaScript code into your HTML files.

Steps to Include the External JavaScript Code into the HTML File

  • Write your JavaScript code on any text editor and save the file with .js extension, for example myfile.js.
  • Use the tag with the src attribute, followed by the path to the external JavaScript file.
  • You have option to include the resources in the tag, but in current JavaScript programming practice, place the JavaScript code just before the tag (recommended).
  • Finally you can include that script at the end of your HTML document.

Code Snippet

<html>
<head>
<body>
<script type="text/javascript" src="path/to/myfile.js"></script>
</body>
</head>
</html>

Note: In order to execute the above JavaScript code put the following code snippet into the file “myfile.js”.

Code Snippet

fnction myFunction()
{
console.log("Hello Dear User");
alert("The sum of 2 and 3 is 5");
}


Audience

This JavaScript tutorial is designed to help the beginners as well as the professional developers. For better understanding the language of the tutorial is kept simple and easy to understand.

Prerequisites

This tutorial demands to have the basic knowledge of the programming languages such as c or c++, HTML for the better understanding of the JavaScript programming language. The other basic requirement to learn JavaScript through this tutorial is the basic knowledge of computer and information technology so you can easily acquire a better understanding JavaScript programming.

Community Helping

In case you find any kind of error like typing error, spelling mistakes, incorrect grammar, incorrect information or any other mistakes. Please feel free to write to us at: akyadav@etutororg.com.