Syntax error How does inline JavaScript work with HTML?

How does inline JavaScript work with HTML?



In this article, you will understand how inline JavaScript works with HTML. Inline JavaScript represents a code block written in between the <script> tags in a html file. The advantage of using inline JavaScript in HTML files is to reduce the round trip of the web browser to the server.

Example 1

Let us understand the how to add a basic statement a html file using inline JavaScript ?

<!DOCTYPE html >
<html>
<head>
   <h2> This is a simple HTML file</h2>
   <script>
      document.write("Hi, This is an inline Javascript code written in between script tags");
   </script>
</head>
</html>

Explanation

  • Step 1 ?In a simple html file, add a heading tag <h2> and display the heading of your choosing.

  • Step 2 ?Add a script tag <script> below the heading tag.

  • Step 3 ?In the script tag, print a text using document.write() function.

Example 2

In this example, let's print an array in a html file using inline javascript.

<!DOCTYPE html >
<html>
<head>
   <h2> This is a simple HTML file</h2>
   <script>
      document.write("An Inline Javascript code to display an array")
      document.write("<br>")
      const inputArray = [3,4,5,6,7,8]
      document.write("
The array is defined as :", inputArray) </script> </head> </html>

Explanation

  • Step 1 ?In a simple html file, add a heading tag <h2> and display the heading of your choosing.

  • Step 2 ?Add a script tag <script> below the heading tag.

  • Step 3 ?In the script tag, define an array namely inputArray and add numeric values to the array.

  • Step 4 ?Print the array using document.write() function.

Updated on: 2023-02-16T12:30:02+05:30

6K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements