1 / 13

Introduction to JavaScript: Interacting with Web Pages

Explore JavaScript, a scripting language for web pages, its objects, methods, events, variables, arrays, and functions. Learn about the Document Object Model (DOM) and Dynamic HTML (DHTML) for dynamic web interactions. See examples and possibilities for dynamic page modifications.

eliza
Download Presentation

Introduction to JavaScript: Interacting with Web Pages

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Introduction to Programming the WWW I CMSC 10100-1 Winter 2003 Lecture 9

  2. 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

  3. What’s an object? • Properties (have values) • can be accessed, set, etc • Abilities (methods) • Everything in the Web page is modelled by an “object”

  4. Some sample Javascript • See examples from Chapter 1 of JS • Events: respond to user action • Send messages, get input form user

  5. More Javascript • Variables: like “x” in algebra -- a name that stands for some other value var myColor = “pink”; window.document.bgColor = myColor;

  6. 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”;

  7. 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

  8. Assignment & Comparison • You can change the values of variables: mynumber = 42; mynumber += 37; mynumber -= 28;

  9. Comparison 39 == 30 + 9; // True 39 >= 39; // True 2 != 2 // False (2 == 2) || (3 == 5) // True (3 == 4) && (7 == 7) // False

  10. Functions • You can write functions to perform specific tasks where the input might be different: • Listing 1.3 in JS book

  11. The DOM • A hierarchical model to represent the objects created by a Web browser • document.getElementById();

  12. 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

  13. What’s on the horizon: • Dynamically modifying page content/appearance • rollovers • style changes • Dynamic visibility • sliding, drop down menus • text popups

More Related