There is adaptability given to incorporate JavaScript code anyplace in an HTML report.
Anyway, the most favoured approaches to incorporate JavaScript in an HTML document are as per the following −
- Script in <head>…</head> section.
- Script in <body>…</body> section.
- Script in <body>…</body> and <head>…</head> sections.
- Script in an external file and then include in <head>…</head> section.
In the accompanying area, we will perceive how we can put JavaScript in an HTML document in various ways.
JavaScript in <head>…</head> segment
In the event that you need to have a script kept running on some occasion, for example,
when a client clicks someplace, at that point you will put that script in the head as pursues −
<html> <head> <script type = "text/javascript"> <!-- function sayHello() { alert("Hello World") } //--> </script> </head> <body> <input type = "button" onclick = "sayHello()" value = "Say Hello" /> </body> </html>
This code will deliver the accompanying outcomes −
Click here for the result
Hello
JavaScript in <body>…</body> segment
In the event that you need a script to keep running as the page stacks so the script produces a script in the page,
at that point, the script goes in the <body> part of the record. For this situation,
you would not have any function characterized utilizing JavaScript. Investigate the accompanying code.
<html>
<head>
</head>
<body>
<script type = "text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<p>This is web page body </p>
</body>
</html>
This code will deliver the accompanying outcomes −
Hello World
This is web page body
JavaScript in <body> and <head> Sections
You can put your JavaScript code in <head>and <body> segment out and out as pursues −
<html>
<head>
<script type = "text/javascript">
<!--
function sayHello() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
<script type = "text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<input type = "button" onclick = "sayHello()" value = "Say Hello" />
</body>
</html>
This code will deliver the accompanying outcome −
Hello World
Say Hello
JavaScript in External File
As you work all the more widely with JavaScript, you will probably find that there
are situations where you are reusing indistinguishable JavaScript code on different pages of a site.
You are not limited to keep up indistinguishable code in different HTML records.
The script tag gives a component to enable you to store JavaScript in an outer record
and afterwards incorporate it into your HTML documents.
Here is a guide to show how you can incorporate an outside JavaScript document
in your HTML code utilizing script tag and its src quality.
To utilize JavaScript from an outer record source, you have to compose all your
JavaScript source code in a straightforward book document with the augmentation “.js” and
afterwards incorporate that document as appeared previously.
For instance, you can keep the accompanying substance in filename.js record
and afterwards, you can utilize sayHello function in your HTML document subsequent to including the filename.js record.