130 likes | 209 Vues
Introduction to Programming the WWW I. CMSC 10100-1 Winter 2003 Lecture 9. Javascript. Scripting language Interpreted by browser Interacts with Web pages Started in 1995 - Netscape 2.0 Microsoft followed suit Long wranglings over standardizing it across browsers. What’s an object?.
E N D
Introduction to Programming the WWW I CMSC 10100-1 Winter 2003 Lecture 9
Javascript • Scripting language • Interpreted by browser • Interacts with Web pages • Started in 1995 - Netscape 2.0 • Microsoft followed suit • Long wranglings over standardizing it across browsers
What’s an object? • Properties (have values) • can be accessed, set, etc • Abilities (methods) • Everything in the Web page is modelled by an “object”
Some sample Javascript • See examples from Chapter 1 of JS • Events: respond to user action • Send messages, get input form user
More Javascript • Variables: like “x” in algebra -- a name that stands for some other value var myColor = “pink”; window.document.bgColor = myColor;
Arrays • An array is a collection of variables in some particular order: var mycolors = new Array(); mycolors[0] = “red”; mycolors[1] = “pink”; mycolors[2] = “blue”;
Methods • Dogs bark, cats pur, cars slow down document.write(“Hello world!”) • Lots of predefined methods for manipulating Web pages, we’ll also learn how to define our own
Assignment & Comparison • You can change the values of variables: mynumber = 42; mynumber += 37; mynumber -= 28;
Comparison 39 == 30 + 9; // True 39 >= 39; // True 2 != 2 // False (2 == 2) || (3 == 5) // True (3 == 4) && (7 == 7) // False
Functions • You can write functions to perform specific tasks where the input might be different: • Listing 1.3 in JS book
The DOM • A hierarchical model to represent the objects created by a Web browser • document.getElementById();
DHTML • DHTML (Dynamic HTML) • Style sheets for color, layout, positioning • Javascript to update these things • Every object has a “style” property • Requires learning some about programming and a lot about Web pages • Example: Hot air balloon
What’s on the horizon: • Dynamically modifying page content/appearance • rollovers • style changes • Dynamic visibility • sliding, drop down menus • text popups