CpSc 217 - Structured and Dynamic Web Programming
The notes found on these pages all reference the textbook given above.
Unless otherwise stated, the citation of the information on these web pages
is that text.
Timing
- setTimeout(alert("hello world"), 2000); //milliseconds
- setInterval(alert("hello world"), 1000); // alert every second
The browser consists of many objects. Some of these objects are discussed here.
The DOM can be easily examined using this page created by Dr. Dailey.
- Navigator-appname, appVersion, platform
- window object -window.open, status
- document object (Yes, again!) - Lots of "stuff". We'll be back
- form object -
Radio buttons, check boxes
Location Property
- document.leocation or window.location
- location property is the current URL of the document
- location.assign("page.html") - makes window load and display the URL
- location.replace("page.html") - makes window load and display the URL,
but removes the current page from the history
History Property
navigator Property
- Used to determine browser used
- navigator.appName - contains full name of web browser
- "Microsoft Internet Explorer"
- "Netscape"
- navigator.appVersion - typically begins with a number then a string
Text Dialogs
- alert() - pop a box up with a message
- prompt() - prompt user for inpu
- confirm() - pop up a box wait for ok to be clicked
- showModalDialog() - permits html formatted code in dialog box. See page 350
- window.onerror - message describing error that isn't handled
IDs of elements
- document.getElementById("string") - gets the id "string"s HTML attribute
-
Example
Timer added
Add ability to click and bring up actor's name
- document.getElementsByName("a") - tags that have name of "a"
var len=document.getElementsByName("a").length;
for (i=0; i<len; i++ )
document.write ("<br>Name A Tag " +i+" has value: " + document.getElementsByName("a")[i].value);
- document.getElementsByTagName("INPUT") - show all input tags
var len=document.getElementsByTagName("INPUT").length;
for (i=0; i<len; i++ )
document.write ("<br>Input Tag " +i+" has value: " + document.getElementsByTagName("INPUT")[i].value);
Opening and closing browser windows
- window.open() - create a new window
- w= window.open()
w refers to new window (set location via w.location="url")
w2=window.open("put URL here", "put name here", "width=400,height=350,resizable="yes");
w2.alert("message for new window");
- window.close() - close current window
- w.close() - close new window from previous example
HTML elements
- document.all
all elements have a page are placed in an array; they can be retrieved by indexing the array with the name of the element
This code produces the output below the table.
Copy and paste the code into a browser and change len to be
document.all.length (Hmmmm....)
|
var len=document.all.length;
for (i=1; i<=len; i++ )
document.write ("<br>Tag " +i+" is: " + document.all[i].tagName); |