Monday, June 17, 2019

Where to Place JavaScript

Where to Place JavaScript

There are three general areas that JavaScript can be placed for use in a webpage.

  1.     Inside the head tag
  2.     Within the body tag (like our example in the previous lesson)
  3.     In an external file (we'll talk about this next lesson)

The location choice of head or body is very simple. If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script in the head. If you want the script to run when the page loads, like our "Hello World!" example in the previous lesson, then you will want to place the script within the body tag.

External JavaScript files and their uses will be discussed in the next lesson.

An Example Head Script

Since we have already seen the kind of script that goes in the body, how about we write a script that takes place when some event occurs? Let's have an alert show up when a user click on a button.
HTML & JavaScript Code:

<html>
<head>
<script type="text/JavaScript">
<!--
function popup() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
<input type="button" onclick="popup()" value="popup">
</body>
</html>


 
Display:

popup


We created a function called popup and placed it in the head of the HTML document. Now every time someone clicks on the button (this is an event), an alert will pop up with "Hello World!". We will go into more depth on functions and events in a later lesson.

No comments:

Post a Comment