JavaScript is an Object Oriented language, sort of. This puts it in a class with C++ and Java. It is based on manipulating objects by modifying their properties or applying methods to them. Most of the objects involved are predefined by the language and
the browser. An object is a collection of all the information you know about a thing and the actions that can be done either by or to that thing. Each object has properties that describe its appearance, purpose, or behavior. They are mostly the CSS properties. Objects can have properties that are themselves objects. An object can have methods, which are actions that can be performed with or to it. An object is a bag of properties and methods.
Some of the things that are represented by objects are the screen (the whole display), the window (the one the browser is in) , the document (pretty much the body tag), forms, tables, etc.
One of the properties on the document object is the background color. We can see what it is like.
function showback() { alert("title is " + document.title + " background color is " + document.bgColor); } // showback |
<a href="#ex1" onClick="showback();">click here</a>
click here.
|
Objects like document have methods. The most common one on document is write. This writes a set of characters out to the page. A method is what in many languages is called a function. It is a small group of instructions that is given a name. When you activate it, or call it, you can give it some information, called arguments or parameters. As an example, the JavaScript to cause my name to appear in the page just below is this.
We can also alter the properties on an object like
var bg; // background color function changeback() { bg=document.bgColor; // save the old color var newbg=prompt("Please enter a new background color"); document.bgColor=newbg; // set to the new color } // changeback |
<a href=#ex2" onClick="changeback();">this</a>
set background color.
|
|
function restoreback() { document.bgColor=bg; // set back to the old color } // changeback |
And reverse it like
<a href="#ex2" onClick="restoreback();">restore background color</a>
restore background color.
|
There are many types of built in objects like strings and dates. We can create our own objects as well. Also, most of the HTML elements on the page can be treated as objects and we will use this to control their properties using the Document Object Model.