Table of Contents
Less Server Interaction
You can create modern, advanced, and interactive client-side interfaces. For example, you can add sliders, slideshows, drag-and-drop features, etc.
Instant Feedback To The User
Within the page’s layout, if your script requires to optimize at a certain point, like when using document.write to create content — you should put it at the point where it should be called, usually within the <body> section.
Let’s ponder upon the following blank HTML document with a browser title of Today’s Date:
Once the page has loaded, you receive an alert shown below:
As you can see in the below example, if you need some changes shown in the body of HTML, we would require that after the <head> section, so that is shown on the page.
The output of the above code is shown like this:
- Code readability and maintenance become very easy.
Let’s explain a small web project on linking JS files to HTML documents. It includes script.js in the js/ directory, style.css in the CSS/ directory, and a main index.html file in the project’s root.
We can begin with our previous HTML document from the section above:
With the help of the following code, You can also add a reference to this script to the <body> section.
The <script> tag signifies the script.js file in the js/ directory of our web project. Let’s consider this line in the context of our HTML file within the <body> section:
You can also edit the style.css file by adding background color and styles to the <h1> header:
You can also reference the CSS file within the <head> section of our HTML document: