Using multiple script tags to prevent errors
In this article, we will see how can we use multiple <script> tags inside the HTML code to prevent from getting errors. To understand this concept, we will first see what kind of error we usually get on the console and then how that can be removed from the code by adding multiple script tags.
Example: The below code example illustrates an error that we can get while not adding the multiple script tag.
Explanation: The button having id btn1 is found in the script, whereas, the button having id btn2 is not found in the script because it has not been created above <script> tag. For this, the button having id btn1 event Listener is working correctly.
The above error that we are getting, can be removed by adding multiple script tags. Although, there are a few points that should be kept in mind while adding the multiple script tag:
- Before adding the script tag, the element we are accessing inside the <script> tag should be present above the <script> tag.
- Multiple <script> tags should be only used inside the body tag, & not anywhere else.
Syntax of Adding multiple script tag:
Example: In this example, we have used the multiple <script> tags for performing different tasks in which we have created two buttons and added the event listener on both buttons where one button on click displays the message on the web page while the other on click removing the message from the web page giving an alert message.