Using JavaScript in HTML

Embedding JavaScript in documents

A script is embedded in HTML within a SCRIPT tag.

<SCRIPT>...</SCRIPT>: The text of a script is inserted between SCRIPT and its end tag.

Attributes within the SCRIPT tag can be specified as follows:

<SCRIPT LANGUAGE="LiveScript">...</SCRIPT>: The LANGUAGE attribute is mandatory unless the SRC attribute is present and specifies the scripting language. (Note: "LiveScript" is the valid tag for Netscape Navigator 2.0b3. "JavaScript" or a similar tag will additionally become valid in Netscape Navigator 2.0b4, but users can assume "LiveScript" will stay valid for the foreseeable future.)
<SCRIPT SRC="http://myscript.ls">...</SCRIPT>: The SRC attribute is optional and, if given, specifies a URL that loads the text of a script.
<SCRIPT LANGUAGE="language" SRC=url>...</SCRIPT>: Both attributes may be present.

Usage Notes

Scripts placed within SCRIPT tags are evaluated after the page loads. Functions are stored, but not executed. Functions are executed by events in the page.
SRC URL information is read in and evaluated as script container content. SRC script is evaluated before in-page script.
The SRC URL should use the .ls suffix.
A named SCRIPT tag contains a function body that can be called in an ONCHANGE event or other event-handler attribute.
Scripts may be placed inside comment fields to ensure that the script is not displayed when the page's HTML is viewed with a browser unaware of the SCRIPT tag. The entire script is encased by HTML comment tags:
```

```
Except for string literals, JavaScript is case-insensitive and treats all letters as lowercase.
Single quotes may be used in JavaScript so that scripts can be distinguished from attribute values using double quotes.

Example 1, a simple script.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="LiveScript">
document.write("Hello net.")
</SCRIPT>
</HEAD>
<BODY>
That's all, folks.
</BODY>
</HTML>

Example 1 page display.

Hello net. That's all folks.

Example 2, a script with a function and comments.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="LiveScript">
<!--  to hide script contents from old browsers
  function square(i) {
    document.write("The call passed ", i ," to the function.","<BR>")
    return i * i
  }
  document.write("The function returned ",square(5),".")
// end hiding contents from old browsers  -->
</SCRIPT>
</HEAD>
<BODY>
<BR>
All done.
</BODY>
</HTML>

Example 2 page display.

We passed 5 to the function.
The function returned 25.
All done.

Example 3, a script with a form and an event handler attribute.

<HTML>                                                           
<HEAD>
<SCRIPT LANGUAGE="LiveScript">
function compute(form) {
   if (confirm("Are you sure?"))
      form.result.value = eval(form.expr.value)
   else
      alert("Please come back again.")
}
</SCRIPT>
</HEAD>

<BODY>
<FORM>
Enter an expression:
<INPUT TYPE="text" NAME="expr" SIZE=15 >
<INPUT TYPE="button" VALUE="Calculate" ONCLICK="compute(this.form)">
<BR>
Result:
<INPUT TYPE="text" NAME="result" SIZE=15 >
<BR>
</FORM>
</BODY>
</HTML>

Example 3 page display.

Result: 14

Example 4, a script with a form and event handler attribute within a BODY tag.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="LiveScript">
function checkNum(str, min, max) {
    if (str == "") {
        alert("Enter a number in the field, please.")
        return false
    }
    for (var i = 0; i < str.length; i++) {
        var ch = str.substring(i, i + 1)
        if (ch < "0" || ch > "9") {
            alert("Try a number, please.")
            return false
        }
    }
    var num = 0 + str
    if (num < min || num > max) {
        alert("Try a number from 1 to 10.")
        return false
    }
    return true
}
function thanks() {
    alert("Thanks for your input.")
}
</SCRIPT>
</HEAD>

<BODY>
<FORM>
Please enter a small number: 
<INPUT NAME="num"
    ONCHANGE="if (!checkNum(this.value, 1, 10)) 
        {this.focus();this.select();} else {thanks()}"
    VALUE="0">
</FORM>
<SCRIPT LANGUAGE="LiveScript">
document.write("<PRE>")
document.writeln("Field name: " + document.forms[0].num.name)
document.writeln("Field value: " + document.forms[0].num.value)
document.write("</PRE>")
</SCRIPT>
</BODY>
</HTML>

Example 4 page display.

Please enter a small number: 7
Field name: num
Field value: 7