Many HTML elements can also be treated as Internet Explorer Scripting Objects. In order to work effectively with VBScript and HTML elements and to see how they can intermingle, you need to understand the Internet Explorer Scripting Object Model.
The Object Model is pretty straightforward, if you understand the “object-ness” of Visual Basic. At the top of the IE Object Model hierarchy is the Window object, which is the parent to all other objects. This arrangement is similar to the Form-Custom Control architecture in Visual Basic (see Figure 7.17). Object referencing works the same in VBScript as in VB:
parent_object.child_object.property = somevalueBe advised that variable scope and types are bit tricky. The scope of VBScript variables is described as procedure scope and script scope. What procedure and script scope means is that the variable can be seen only in the sub or function if it is declared inside the procedure. If it is declared outside a procedure, it has script wide scope. A script in this case means an HTML page. All variables in VBScript are of the data type Variant but you must watch the subtype.
The Internet Explorer Scripting Object Model Hierarchy
The following sections are a brief description of the objects in the IE Object Model, The files used in the listings can be found in the /HTML directory of this project, and on the CD-ROM that comes with this book.
Window
The Window is the object at the top of the IE Scripting Object Model. Operationally, it is the Internet Explorer.
Methods: alert, confirm, prompt, open, close, setTimeout, clearTimeout, navigate
Events: onLoad, onUnload
Properties: name, parent, opener, self, top, location, defaultStatus, status, frames, history, navigator, document
Listing 7.16 - HELLO.HTM - To send a message to a user, you can use the Window object’s alert method.
<HTML><HEAD> <TITLE>Hello</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub window_onLoad window.Alert "Hello World" End Sub --> </SCRIPT> </HEAD>
Frame
The Frame object is similar to and decends from the Window object. Although you can have a collection of Frames, each frame has its own property values and its own document.
Methods: See Window object
Events: See Window object
Properties: See Window object
History
The History object holds infomation about what has been in the window before. It gets this information for the browser’s History list. (see Figure 7.18)
The Internet Explorer's History list in the Go menu.
Methods: back, forward, go
Events: none
Properties: length
Listing 7.17 - BACK.HTM - To go back to a previous page, use the History object's Back method.
<HTML><HEAD> <TITLE>Back</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub window_onLoad History.back 1 End Sub --> </SCRIPT> </HEAD>
Navigator
The Navigator object gives you infomation about the browser in use.
Methods: none
Events: none
Properties: appCodeName, appName, appVersion, userAgent
Listing 7.18 - N_GATOR.HTM - To find out what browser you client is using, use the appName property of the Navigator object.
<HTML><HEAD> <TITLE>Navigator</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub window_onLoad Alert Navigator.appName End Sub --> </SCRIPT> </HEAD>
Location
The Location Object encapsulates an URL.
Methods: none
Events: none
Properties: href, protocol, host, hostname, port, pathname, search, hash
Listing 7.19 - LOCATION.HTM - To find out the protocol that is presently being used by your document, use the protocol property of the Location object.
<HTML><HEAD> <TITLE>Location</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub window_onLoad Alert Location.protocol End Sub --> </SCRIPT> </HEAD>
Script
The Script object defines the Script used in the Window. Granted, this description is rather vague. As some point Microsoft will probably extend and enhance the utility of this object.
Document
The Document object encapsulates the document in the current window as well as the elements in the document, i.e., links, forms, buttons and ActiveX objects. The objects: Link, Anchor, and Form descend from the Document object.
Methods: write, writeLn, open, close, clear
Events: none
Properties: linkColor, aLinkColor, vLinkColor, bgColor, fgColor, anchors, links, forms, location, lastModified, title, cookie, referrer
Listing 7.20 - DOCUMENT.HTM - You can write a line of code to the browser using the write method of the Document Object.
<HTML><HEAD> <TITLE>Document</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- document.write ("I am writing a line.") --> </SCRIPT> </HEAD> </HTML>
Link
The Link Object is an encapsulation of an HTML <A HREF….> tag on a given page. It is read-only. Because a Link is a member of the Links collection, (an array of <A HREF…> tags), you need to access an a particular link through the Document object’s Links property.
Methods: none
Events: onMouseMove, onMouseOver, onClick
Properties: href, protocol, host, hostname, port, pathname, search, hash, target
Listing 7.21 - LINK.HTM - To find out how many <A HREF....> tabs are on a page, use the Document object property links. To work find out the text of an <HREF>, use the href property of the Link object.
<HTML><HEAD> <TITLE>Document</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub window_onUnLoad Dim NumOfLinks Dim MyAlertMsg NumOfLinks = Cstr(document.links.length) MyAlertMsg = "There are " & NumOfLinks & " links on this page." MyAlertMsg = MyAlertMsg & Chr(10) & Chr(13) MyAlertMsg = MyAlertMsg & "The first link is " & document.links(0).href Alert MyAlertMsg End Sub --> </SCRIPT> </HEAD> <BODY> <P> <A HREF="http://www.whitehouse.gov"> Go to the White House.</A> <P> <A HREF="http://www.senate.gov"> Go to the Senate. </A> </BODY> </HTML>
Anchor
The Anchor object is similar to a Link object. The difference is that the Anchor object references all <A> tags in a given document as opposed to <A HREF…> objects.
Methods: none
Events: none
Properties: name
Form
The Form object represents an HTML <FORM> element in a Document object. You can reference a Form object by either a name or an array index. The Element object is a child of the Form object.
Methods: submit
Events: onSubmit
Properties: action, encoding, method, target, elements
Listing 7.21 - OM_FORM.HTM - A simple form element.
<HTML> <HEAD> <TITLE>The Virtual Music Store</TITLE></HEAD> <FORM method=post action=/cgi-win/mycgi.cgi> Enter your name: <INPUT TYPE=TEXT NAME=yourname> <BR> <INTPUT TYPE=Submit NAME=submit VALUE=”Enter Name”> </FORM> </BODY></HTML>
Element
The Element object is a control placed in your HTML document by using the <INPUT> tag or the <OBJECT> tag. The former are called HTML elements. The latter are Intrinsic Controls and ActiveX Controls.
Methods: click, focus, blur, select
Events: onClick, onFocus, onBlur, onChange, onSelect
Properties: form, name, value, defaultValue, checked, defaultChecked, length, options, selectedIndex
Listing 07.22 - ELEMENT.HTM - To handle a click event of an Element object of type, Button, code the onClick event of the Element object.
<HTML><HEAD> <TITLE>Element</TITLE> <SCRIPT LANGUAGE=VBScript> <!-- Sub btnOK_onClick frmMain.btnOK.Value ="Thank you!" End Sub --> </SCRIPT> </HEAD> <BODY> <FORM NAME=frmMain> <INPUT TYPE=button NAME=btnOK VALUE="Click me"> </FORM> </BODY> </HTML>