Tutorial

❮ Previous Next ❯

The <script> Tag

The <script> tag is used to embed a client-side script (JavaScript).

In HTML, JavaScript code is inserted between <script> and </script> tags.

The <script> element either contains scripting statements, or it points to an external script file through the src attribute.

EXAMPLE ❯


                                <script><br />
document.getElementById("demo").innerHTML = "My First JavaScript";<br />
</script>

JavaScript Events

The change in the state of an object is known as an Event. In html, there are various events which represents that some activity is performed by the user or by the browser. When javascript code is included in HTML, js react over these events and allow the execution. This process of reacting over the events is called Event Handling. Thus, js handles the HTML events via Event Handlers.

For example, when a user clicks over the browser, add js code, which will execute the task to be performed on the event.

JavaScript Functions

A JavaScript function is a block of code designed to perform a particular task.

A JavaScript function is executed when "something" invokes it (calls it).

JavaScript in <head> or <body>

You can place any number of scripts in an HTML document.

Scripts can be placed in the <body>, or in the <head> section of an HTML page, or in both.

JavaScript in <head>

Scripts can be placed in the <body> , or in the <head> section of an HTML page, or in both.

In this example, a JavaScript function is placed in the <head> section of an HTML page.

The function is invoked (called) when a button is clicked:

EXAMPLE ❯


                                <!DOCTYPE html><br />
<html><br />
<head><br />
<script><br />
function myFunction() {<br />
  document.getElementById("demo").innerHTML = "Paragraph changed.";<br />
}<br />
</script><br />
</head><br />
<body><br />
<h2>Demo JavaScript in Head</h2><br />
<br />
<p id="demo">A Paragraph</p><br />
<button type="button" onclick="myFunction()">Try it</button><br />
<br />
</body><br />
</html>

JavaScript in <body>

In this example, a JavaScript function is placed in the <body> section of an HTML page.

The function is invoked (called) when a button is clicked:

EXAMPLE ❯


                                <!DOCTYPE html><br />
<html><br />
<body><br />
<br />
<h2>Demo JavaScript in Body</h2><br />
<br />
<p id="demo">A Paragraph</p><br />
<br />
<button type="button" onclick="myFunction()">Try it</button><br />
<br />
<script><br />
function myFunction() {<br />
  document.getElementById("demo").innerHTML = "Paragraph changed.";<br />
}<br />
</script><br />
<br />
</body><br />
</html>

❮ Previous Next ❯