How To Link JS File In HTML
Last Updated : Mar 11, 2024
IN - HTML JavaScript | Written & Updated By - Amruta
In this tutorial we will show you how to link JS file in HTML, in HTML, there is also a property to link a js file in html like CSS where js is known as JavaScript. So, JavaScript is mostly used to make a responsive website.
Now, in this session we will learn that how we are able to link a js file in html.
Step By Step Guide On How To Link JS File In HTML :-
As, there are three ways to add js (JavaScript) in html. That are:
- Inline JavaScript
- Internal JavaScript
- External JavaScript
And first two from them do not generate any external file so that there is no any generation of link to add in html file.
So, the last one that is external js file, in which an external file is created which need to link in html file. But except the concept of linking file, all the work is same in all js file types.
<!DOCTYPE html>
<html>
<head>
<title> Title of the document<title>
</head>
<body>
<script src=”name of js file with .js extension”>
</script>
<h1>
It is a file with JavaScript. JavaScript file is linked above
</h1>
</body>
</html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- Here, in body tag first we linked the JavaScript file. For linking this file, we create a script tag. Script tag is mostly used to link any JavaScript file but in body tag, not in head like CSS files.
- And in JavaScript file, we have to write about the required codes, that we need in html file and after this we have to save the JavaScript file with .js extension. You can save this file in any other folder, at desktop and at same location where your html file is.
- Now, the script tag that we create in html, in this we have to write about the source of JavaScript file, that where it is saved, here we have to specify full path with file name and its extension.
- And you can also use this script tag anywhere in the body, it’s not mandatory to use a top of page and after this you are able to write your html codes as you do.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
In conclusion, we can say that we have to link the JavaScript file using script tag.
And when you open this webpage in your browser, the result will be shown there that how the JavaScript codes work. I hope this tutorial on how to link JS file in HTML helps you.
About Amruta
