Ramp Up to JavaScript
JavaScript is a scripting language that has been become the international standard. It is the means to create "executable content" in web pages. A web page need no longer be static HTML, but can include dynamic programs that interact with the user, control the browser and dynamically create HTML content.
The most common way of embedding JavaScript statements into an HTML document is via the <script> statements:
<SCRIPT>
JavaScript statements...
</SCRIPT>
Here is a simple script:
1 |
<HTML> <HEAD> |
2 |
<SCRIPT LANGUAGE="JavaScript"> |
3 |
document.write("Hello net.") </SCRIPT> |
4 |
</HEAD> <BODY> That's all, folks. </BODY> </HTML> |
Comments:
<SCRIPT LANGUAGE="JavaScript">
This specifies that the browser should interpret the following script with "JavaScript".
document.write("Hello net.")
The HTML document current being displayed is a document object. An important method of the document object is the write() method. Here the write() method is taking the string "Hello net.".
The "document.write" formulation gives both the current object and its method.
Example two:
1 |
<HTML> <HEAD> <TITLE>Today's Date</TITLE> |
2 |
<SCRIPT LANGUAGE="JavaScript"> |
3 |
function print_todays_date() |
4 |
{ var d = new Date(); document.write(d.toLocaleString()); } |
5 |
</SCRIPT> </HEAD> <BODY> <HR> The date and time are: <BR><B> |
6 |
<SCRIPT LANGUAGE="JavaScript"> print_todays_date(); </SCRIPT> |
7 |
</B><HR> </BODY> </HTML> |
Comments:
function print_todays_date()
{
… blah, blah …
}
This defines a callable function written in JavaScript.
var d = new Date();
A new variable "d" is declared of the type Date(). Date is a standard JavaScript object that can be used to get the date and time information. The date and time are stored in the variable "d".
document.write(d.toLocaleString());
This is an example of using two different methods. First you’re using the write method of the document object. Then you’re using the "toLocaleString() method of the date object to convert the date to a string, using the local time zone,
<SCRIPT LANGUAGE="JavaScript">
print_todays_date();
</SCRIPT>
This calls the function.
Example three:
<HTML>
<HEAD><TITLE>Random Quotations</TITLE>
</HEAD>
<BODY>
<H1>Random Quotations</H1>
<HR>
<SCRIPT LANGUAGE="JavaScript">
//store the quotations in arrays
quotes = new Array(6);
authors = new Array(6);
quotes[0] = "I have a new philosophy. I'm only going to dread one day at a time.";
authors[0] = "Charles Schulz";
quotes[1] = "Reality is the leading cause of stress for those in touch with it.";
authors[1] = "Jack Wagner";
//Several examples deleted here for brevity
quotes[5] = "Man invented language to satisfy his deep need to complain.";
authors[5] = "Lily Tomlin";
//calculate a random index
index = Math.floor(Math.random() * quotes.length);
//display the quotation
document.write("<DL>\n");
document.write("<DT>" + "\"" + quotes[index] + "\"\n");
document.write("<DD>" + "-- " + authors[index] + "\n");
document.write("</DL>\n");
//done
</SCRIPT>
<HR>
The quotation above was generated randomly when you loaded this page.
<HR>
</BODY>
</HTML>