Last Updated : Jan 1, 2023
Here we defined head tag with id attribute for appends text defined in external script file it is done by script.js file. Using script tag with src attribute we linked script.js file on our current html file.
So what we defined in script file will work on our current html page, here we defined alert message it will alert user with some message and we appends heading line text on h1 html tag by id attribute ‘h’.
<!DOCTYPE html> <html> <head> <title>INCLUDE EXTERNAL JS FILE</title> </head> <body> <h1 id="h"></h1> <script src="PDF/script.js"></script> </body> </html>
alert("THIS IS EXTERNAL FILE"); document.getElementById('h').innerHTML="WELCOME TO EXTERNAL SCRIPT PAGE";
- <!DOCTYPE html> tag which is instruct the web browser about what version of HTML file written in and it’s not have any ending tag.
- The<html> tag is used to indicate the beginning of HTML document.
- As above shown <head> tag is contains information about webpage and external file links are declared here. <title> tag is used for set the webpage title.
- Both <head> and <title> tags having their pair end tag, so we need to close the ending tags respectively. If you’re not closed anyone of ending tag properly that is also affect the webpage result.
- <body> tag is beginning of main coding part because it contain coding of entire website blocks and elements described here.
- We defined one h1 tag with id attribute ‘h’ without text because we defined text on script.js file. Then we imported external script.js file using script with src attribute.
- Both </body>,</html> tags closed respectively. </body> tag indicates the end of body, Then </html> tag indicates the end of HTML document.
When we executes our program on browser we can see one alert box with message will appear on top of webpage and we appended message will displayed on webpage.
We can also define in script external file with any other content or animation code anything that will depends on our own thought try to explore differently.