JavaScript | Java Script | Web Browser

The JavaScript Object Model Objectives Describe the JavaScript object model. Use the window object.

Manipulate properties and methods of the document object. Use the with statement. Deploy the image object. Use the history object. Evaluate and change URL information with the location object. Use the navigator object. JavaScript = Web JavaScript was made for the web. To take advantage features and capabilities provided by a browser, special browser objects have been built into the JavaScript language. The JavaScript object model divides these objects into three groups. Three General Groups of Objects in JavaScript Object Model: browser objects language objects form field objects All three of these groups of objects provide properties and methods to create complex JavaScript programs. Remember: Objects are things that model the characteristics of real objects (Such as a button, a window, etc.) Properties are descriptive characteristics of an object, such as height or color. Methods are actions performed by objects.

Exactly what is this JavaScript Object Model? It is simply a way to divide and organize all of the objects in the browser (and their associated methods and properties) that JavaScript can take advantage of. What is containership? To understand containership, you should examine the JavaScript object model for yourself, shown on the next slide.

or as window. etc. menu bars.alert(“Welcome!). we can write it as either: alert(“Welcome!). What do we mean. Example: You cannot reference the checkbox of a form without first referencing the form. Window Object highest level in the JavaScript hierarchy default object represents the frame of the browser and the things associated with it. When we write the alert method. The window is optional. such as scroll bars. default object? The alert method is part of the window object. If it wasn’t. since window is the default object. You can’t get a Tupperware bowl out of another one without first accessing the one that it’s contained in.What is containership? Containership relates to the principle that some objects cannot be used or referenced without a reference to the container object. we’d have to . navigation bars.

You can work with everything within the current document. you can control that window! You can control: where the window opens on the screen the size of the window whether or not the window contains scroll bars. you must include the document in the dot notation.write it. Now. One thing you can do with the window object is open content in new windows. This is an example of dot notation.alert(“Welcome!). With Statement If you are going to use several properties and/or methods with a single object. When you think about dot notation. we can do that in html by doing this: Opening Windows <a href=http://www. the JavaScript object model! Document Object subordinate to the window object.midsouthcc. we can write it as either: alert(“Welcome!). and most importantly. think about containership and target=“_blank”>link goes here</a> But you don’t have any control over the window! By using JavaScript. you can . like this: document. or a menu bar whether or not the window can be resized and more! Dot Notation Remember a few slides back when you read this? When we write the alert method.write(“Hello.”). text anchors forms links page title current location and URL current background and foreground colors. or as window.

back(). <FORM> <INPUT TYPE=“button” VALUE=“Back” onClick = “history. Example: <INPUT TYPE=“button” VALUE=“Visit CIW” onClick=“location.href = ‘http://www.ciwcertified.”> </FORM> Length Forward Location Object You can use the location object to change URL information. You can use the image object to create button rollovers. An array is a group of objects or values with the same name.appName. var userBrowser = navigator. . History Object You can access previous pages visited without hitting BACK button on’. Syntax: with(objectname) { //statement(s) referencing objectname } Image Object resides beneath the document object in the hierarchy.”> Reflects information about the browser being used. The image object is accessible as an array of the document object.use the with statement. but accessed individually with an index number.

Sign up to vote on this title
UsefulNot useful