How Inline JavaScript Works 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 ?

Open Compiler
<!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.

Open Compiler
<!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

875 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements