JavaScript Base Objects    Everything in the page is an object. The main document, Textboxes, Anch

JavaScript Base Objects    Everything in the page is an object. The main document, Textboxes, Anchors, Divs and other HTML elements are ob
Generic placeholder image

Mukesh R

JavaScript Base Objects

   Everything in the page is an object. The main document, Textboxes, Anchors, Divs and other HTML elements are object examples. Each object has its own properties like color, width, text and etc. which can be accessible by putting a dot after its name. If you have a good HTML editor like Microsoft FrontPage, the list will be open when you put a dot in some cases. As we’ve said before, JavaScript enable you to control objects and their properties.
        The first object introduced here is ‘document’ that control whole document and you can even access to all parts of your page by this object, too. Let’s change the page title for our first example:
 
Code
document.title= 'My JavaScript Page'
 
Look at above example; we’ve choosen the desired object first (here 'document'); then we’ve inserted a dot to access its properties. Because we want to change the title, we’ve put it at the left (like variables when get new values). A '=' sign and new string value in the quotes are to set new title. Run the page in the browser and look at the page title at the its top; you’ll see this new title name there.
 
Other 'document' properties are listed in the following table:
 
Property
Description
Example
.linkColor
Unvisited links Color
document.linkColor= 'black'
.alinkColor
Currently Selected links Color
document.alinkColor= 'green'
.vlinkColor
Visited links Color
document.vlinkColor= 'red'
.bgColor
Page background Color
document.bgColor= "#CCFFFF"
.fgColor
Page foreground (texts) Color
document.fgColor ='blue'
.fileCreatedDate
Current page Created Date
alert(document.fileCreatedDate)
.lastModified
Last Modification Date of Page
alert(document.lastModified)
.location.host
The Address of page Host
alert(document.location.host)
.location.hostname
The Name of page Host
alert(document.location.hostname)
.location.href
The Url of the page
alert(document.location.href)
.location.pathname
The page Path in the host
alert(document.location.pathname)
 
      The four last rows of the table differ from the others. 'location' is an object too, which has taken a place inside the 'document'; so we can get access to it by a dot after 'document'. To see its properties, just follow the structure (put a dot!). We may have more than one object inside other ones, like what we have had here.
Notice that some browsers may not support some of the above properties and be careful for the CAPITAL and small letters.
Another useful object is 'window' which is used to deal with current window:
 
Property
Description
Example
.screenLeft
Reads the distance of the page from the left side of the screen
alert(window.screenLeft)
.screenTop
Reads the distance of the page from the top side of the screen
alert(window.screenTop)
.location
Gets the page location on the host (Like document.location)
alert(window.location)
.screen.height
Get general screen height from screen object
alert(window.screen.height)
.screen.width
Get general screen width from screen object
alert(window.screen.width)
 
Note that the 'window' object name can be removed from above codes and you can use them directly.