Home Tutorials Videos Q&A MCQ Shortcuts Exercises Appointment Login
Lesson 4 of 30 – HTML Script Tag
13%

HTML Script Tag

The HTML <script> tag is used to add JavaScript code to a web page. It allows browsers to execute JavaScript programs and make web pages interactive.

Note: JavaScript code can be written directly inside the HTML file or linked from an external JavaScript file.
What is the Script Tag?

The <script> tag is an HTML element used to embed or reference JavaScript code.

  • Adds JavaScript to HTML pages.
  • Can contain internal JavaScript.
  • Can link external JavaScript files.
  • Makes web pages interactive.
  • Supported by all modern browsers.
Internal JavaScript

Internal JavaScript is written directly inside the HTML document.

Example:
<script>
alert("Welcome to Soopro Pathshala");
</script>
Output:
A popup message saying "Welcome to Soopro Pathshala".
HTML Page Example

JavaScript can be added inside an HTML page.

<html>
<body>
<h1>JS Tutorial</h1>

<script>
alert("Hello JavaScript");
</script>

</body>
</html>

The browser executes the JavaScript code when the page loads.

HTML4 and HTML5 Script Tag

The use of the <script> tag has changed slightly from HTML4 to HTML5.

HTML Version Requirement
HTML4 Required type="text/javascript".
HTML5 The type attribute is optional.
HTML4 Example:
<script type="text/javascript">
alert("Hello");
</script>
HTML5 Example:
<script>
alert("Hello");
</script>
Multiple Script Tags

An HTML page can contain multiple script tags.

The browser executes them one by one in the order they appear.

<script>
alert("JavaScript 1");
</script>

<script>
alert("JavaScript 2");
</script>

<script>
alert("JavaScript 3");
</script>
Execution Order:
  1. JavaScript 1
  2. JavaScript 2
  3. JavaScript 3
Where to Place Script Tags?

Script tags can be placed inside the <head> or <body> section.

Location Purpose
Head Functions needed before page loading.
Body Scripts executed after page content loads.

For better page performance, many developers place JavaScript just before the closing </body> tag.

External JavaScript File

JavaScript code can be stored in a separate file with the .js extension.

Example:
<script src="script.js">
</script>

The browser loads and executes the JavaScript file automatically.

Advantages:
  • Easy to maintain.
  • Reusable across multiple pages.
  • Improves website organization.
  • Faster page loading through caching.
Best Practices
  • Use external JavaScript files for large projects.
  • Keep scripts organized.
  • Place scripts before the closing body tag when possible.
  • Use meaningful file names.
  • Write clean and readable code.
  • Test JavaScript in different browsers.
Key Points
  • The <script> tag is used to add JavaScript to HTML.
  • JavaScript can be internal or external.
  • HTML5 does not require the type attribute.
  • An HTML page can contain multiple script tags.
  • Scripts execute in the order they appear.
  • Script tags can be placed in the head or body section.
  • External JavaScript files use the src attribute.
  • External files improve code management.
Advantages of External JavaScript
  • Code can be reused.
  • Easy maintenance.
  • Cleaner HTML pages.
  • Faster loading through browser caching.
  • Easy debugging.
  • Suitable for large projects.

🧠 Quick Quiz

Which HTML tag is used to include JavaScript code?



← Previous Next →