HTML Scripts

A script is a small piece of program that can add interactivity to your website. For example, a script could generate a pop-up alert box message, or provide a dropdown menu. This script could be Javascript or VBScript.

You can write your Event Handlers using any of the scripting language and then you can trigger those functions using HTML attributes.

There are two ways of using a style sheet in an HTML document:

External Script:

If you have to use a single script functionality among many HTML pages then it is a good idea to keep that function in a single script file and then include this file in all the HTML pages. You can incluse a style sheet file into HTML document using <script> element. Below is an example:

<head>
<script src="yourfile.js" type="text/javascript" />
</head>

Internal Script:

You can write your script code directly into your HTML document. Usually we keep script code in header of the document using <script> tag, otherwise there is no restriction and you can put your source code anywhere in the document. You can specify whether to make a script run automatically (as soon as the page loads), or after the user has done something (like click on a link). Below is an example this would write a Hello Javascript! message as soon as the page loads.:

<head>
<title>Internal Script</title>
</head>
<body>
<script type="text/javascript">
   document.write("Hello Javascript!")
</script>
</body>

This will produce following result:

To become more comfortable - Do Online Practice

Writing Event Handler:

It is very easy to write an event handler. Following example explains how to write an event handler. Let's write one simple function myAlert in the header of the document. We will call this function when any user will bring mouse over a paragraph written in the example.

<head>
<title>Event Handler Example t</title>
<script type="text/javascript">
function myAlert()
{
    alert("I am an event handler....");
	return;
}
</script>
</head>
<body>

<span onmouseover="myAlert();">
   Bring your mouse here to see an alert
</span>

</body>

Now this will produce following result. Bring your mouse over this line and see the result:

Bring your mouse here to see an alert

To become more comfortable - Do Online Practice

Hide Scripts from Older Browsers

Athough most (if not all) browsers these days support scripts, some older browsers don't. If a browser doesn't support JavaScript, instead of running your script, it would display the code to the user. To prevent this from happening, you can simply place HTML comments around the script. Older browsers will ignore the script, while newer browsers will run it.

JavaScript Example:
	<script type="text/javascript">
	<!--
	document.write("Hello Javascript!");
	//-->
	</script>

VBScript Example:
	<script type="text/vbscript">
	<!--
	document.write("Hello VBScript!")
	'-->
	</script>

The <noscript> Element:

You can also provide alternative info for users whose browsers don't support scripts and for users who have disabled scripts. You do this using the <noscript> tag.

JavaScript Example:
	<script type="text/javascript">
	<!--
	document.write("Hello Javascript!");
	//-->
	</script>
    <noscript>Your browser does not support Javascript!</noscript>
VBScript Example:
	<script type="text/vbscript">
	<!--
	document.write("Hello VBScript!")
	'-->
	</script>
    <noscript>Your browser does not support VBScript!</noscript>

Default Scripting Language

You can specify a default scripting language for all your script tags to use. This saves you from having to specify the language everytime you use a script tag within the page. Below is the example:

<meta http-equiv="Content-Script-Type" content="text/JavaScript" />

Note that you can still override the default by specifying a language within the script tag.