meets Tuesday and Thursday from 0800-0915
office hours in Manning 112
Class Schedule
10 Jan | intro
15 Jan | clients
17 Jan | servers
22 Jan | networks
24 Jan | basics lab
29 Jan | structural layer
31 Jan | presentational layer
05 Feb | working with layers
07 Feb |
behavior layer; server-side scripts |
client side scripts |
DHTML practice |
next session
12 Feb | images & design
14 Feb | website lab
19 Feb | document markup
21 Feb | tools that read markup
26 Feb | document markup lab
28 Feb | spreadsheets
05 Mar | formulas & functions
07 Mar | data display
19 Mar | database tools
21 Mar | spreadsheets lab
26 Mar | relational databases
28 Mar | tables
02 Apr | relationships
04 Apr | input & output
09 Apr | SQL
11 Apr | complex queries
16 Apr | databases lab
18 Apr | presentation design
23 Apr | presentation delivery
25 Apr | presentation lab
30 Apr | 0800-1100 | final in class presentation
This work
is licensed under a
Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
home & schedule | class blog | syllabus | contact | grades
Client side scripts do not need a server to work.
They are not for collecting data,
rather they are for introducing some sort of dynamism into your web page.
As it implies, client side scripts are scripts on a page that do all their work on the client side of the relationship. They do not depend on the server. As such, there are things they cannot do (they are not good at collecting data and storing it, for example). But there are things they can do and do well, such as causing the page to react to user input.
CGI scripts are one server-side variant. Now we will be looking at client-side scripts. Client-side scripts are very often written in JavaScript, since JavaScript is a scripting language supported by most browsers.
Client-side scripting is about "programming" the behavior of the browser.
Dynamic HTML is a collective term for a combination of new Hypertext Markup Language (HTML) tags and options, that will let you create Web pages more animated and more responsive to user interaction than previous versions of HTML.
DHTML, then, is expressed in scripts written in your HTML code to create programs that add interactivity to your page. You can find tutorials for both all over the web as well as sites that offer free examples of DHTML scripts. An example is Dynamic Drive.
JavaScript is a client-side scripting language that adds interactivity to web pages and lets designers control various aspects of the browser itself.
A scripting language like JavaScript is somewhere between a markup language, like HTML, and a full-blown programming language, like Java. (An example of Java)
With it, you can add extra functionality to your web site by using short segments of scripting code that has a syntax that is fairly easy to understand.
As with CGI scripts, there are numerous site on the web that offer free JavaScript scripts for use, many that offer to sell such scripts, and innumerable ones that incorporate JavaScript in their code. You can look at the underlying code of any page to see what they are doing.
JavaScript is a client-side scripting language. A web page designer creates simple script programs that are embedded in HTML documents and are interpretable by "script-aware" browsers.
JavaScript is well suited for responding to user actions and for doing simple processing without getting servers involved.
JavaScript is not well-suited for applications that require large amounts of data or that need access to files on the browser's machine.
Tightly intertwined with JavaScript is the Document Object Model (or DOM).
Much of JavaScript revolves around the notion of an event and what things can happen when an event occurs.
So a script allows you to specify what actions you'd like to happen when the user does something (like click on a button in a form, mouse over an object, or something else).
Understanding HTML is handy, because scripts are HTML commands, entered into the HTML code. You need to tell the browser that you are using a script and what kind of script you are using.
<html>
<head>
<title>Simple Scripts</title>
</head>
<body>
<script type="text/javascript" >
document.write("<h2>Table of Factorials</h2>");
for(i = 1, fact = 1; i < 10; i++, fact *= i) {
document.write(i + "! = " + fact);
document.write("<br>");
}
</script>
<p>Other text in the page.</p>
</body>
</html>
script
- identifies that a script is being used
type
- identifies the scripting language in use
="text/javascript"
- which, in this case, is JavaScript
document.write("...")
- content of the script
/script
- closes the script section
In this case, it needs an HTML tag that the intrinsic event depends upon; it needs
The event name and the script go inside the HTML tag and the script is enclosed in double quotation marks.
<html>
<head>
<title>Triggering Scripts</title>
</head>
<body>
<p>
<a What href="time.html" onclick ="alert('Today is '+ Date())"> time </a> is it?
</p>
<p>Other text in the page.</p>
</body>
</html>
Try some of them out by replacing the event in the code above.
If the script requires quotation marks, "use 'single quotes' to differentiate from the double quotes that enclose the entire script."