JavaScript Tutorial Part 4 : The document Title Property

The Title of a web page appears at the very top of the browser window. You set it by typing some text between the two <TITLE> tags. You can use JavaScript to either get the Title or to set a new one. Here’s a script that pops up the Title in an alert box. Try it out and see it in action:

<HTML>
<HEAD>
<TITLE>The title of this web page</TITLE>

<SCRIPT LANGUAGE = JavaScript>

alert(document.title)

</SCRIPT>

</HEAD>

<BODY>

</BODY>
</HTML>

You can also reset the title of the web page. Change you alert code to this:

alert(document.title = “Now I’ve changed it”)

The equals sign in there doesn’t actually mean equals. It means “assign the value“. So what we’re saying is “Assign the value of ‘Now I’ve changed it’ to the title of the document.”

Any direct text that you type after the “assignment operator” (the equals sign) needs to go inside double quotes.

Load up your new code in your browser, and watch what happens. First, you’ll get an alert box:

Netscape/Mozilla Alert Box

Alert Box in Netscape

Internet Explorer Alert Box

Alert Box in Internet Explorer

But that’s not the only thing that happens. If you look at the very top of your browser, the title should have change from “The title of this web page” to “Now I’ve changed it.” Here’s the changed version in the two most popular browsers:

Netscape Title Bar

Internet Explorer Title Bar

 

Now that you’re an expert with alert boxes, here’s a little exercise.

Exercise

  • Use an alert box to test out the location property of document.

In the next part, we’ll see how to set up an easy rollover using JavaScript and images.

Leave a comment