The Document object in JavaScript is one of the most commonly used objects. The main purpose of the document object is to write something to the web page or more appropriately is to display text content on a web page. The document object also holds all the information contains in a web page, such as its background color, its title, the date the web page was last modified and more.
Document object has properties and methods. The properties are shown in Table 12.1.
| Properties | Description |
|---|---|
| bgColor | Specifies the background color of the webpage. |
| fgColor | Specifies the background color of the webpage. |
| title | Displays the title of the web page. |
| location | Displays URL of the document |
| lastModified | The date the web page was last modified. |
| linkColor | Hyperlink color of a web page in hexadecimal value |
| vlinkcolor | Visited hyperlink color of a web page in hexadecimal value |
| alinkcolor | Activated hyperlink color (when the button is pressed and before releasing it) of a web page. |
| links.length | Number of links in a web page. |
Other than the properties, there are also a number of methods that are associated with the document object. The methods allow the document object to perform some operations. The methods are listed in Table 12.2.
| Method | Description |
|---|---|
| write("text") | Display text or string in the current window |
| writeln("text") | Display text or string in the current window and adds a line after the end of the text. |
| Clears( ) | Clear the window |
| Close( ) | Closes the window |
For example, if you wish to specify the background of the web page, you can use document.bgcolor="red" or use the color code document.bgcolor="#ff0000" If you wish to specify the title of the web page, you can use document.title="My Title" If you wish to specify the color of the hyperlinks in a web page, you can use document.linkColor="Cyan" Let's look at the actual application in a web page, as shown in Example 12.1.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Document Object</title>
</head>
<body bgcolor="#00FFFF">
<a href="https://javascript-tutor.net/">JavaScript Tutorial</a>
<br>
<a href="http://www.htmltutor.org/">HTML Tutorial</a>
<hr>
<script>
document.bgColor = "cyan";
document.linkColor="Magenta";
document.write("This web page title is : "+document.title);
document.write("<br>This web page backgroud color code is: "+document.bgColor);
document.write("<br>The URL of the web page is: "+document.location);
document.write("<br>This web page was last modified at : "+document.lastModified);
document.write("<br>The hyperlink color code of this web page is : "+document.linkColor);
document.write("<br>The visited hyperlink color code of this web page is : "+document.vlinkColor);
document.write("<br>The active hyperlink color code of this web page is : "+document.alinkColor);
document.write("<br>The number of hyperlinks of this web page is : "+document.links.length);
document.clear;
</script>
</body>
Click Example 12.1 to see the output.
Copyright©2008 Dr.Liew Voon Kiong. All rights reserved |Contact|Privacy Policy