Browser Detection

This sample page demonstrates an inconsistency in the handling of Javascript between the two mainstream browsers, Netscape Communicator and Microsoft Internet Explorer. Try it in both browsers.

Which browser executes the Javascript code correctly?

Peruse the source code:

• main page
• upper frame
• lower frame

• the history object
  • a sub-object of the Window object in Internet Explorer
  • a sub-object of the Document object in Communicator
  • This is rarely a problem since the upper level objects of History are assumed in both browsers.
  • It is a problem when History is applied to frames.
  • To use History with frames in a Netscape browser, it must be prefaced with parent and the name of the frame (e.g. parent.bottom.history() where bottom is the frame name).
• the back() method of the history object loads the previous URL
• the navigator object
and its properties:
• appName contains the browser name
• appVersion contains the browser version
• The appName property logged by the server as the user-agent. This text string is specified in RFC 1945 and RFC 2068 and is A href="http://www.mozilla.org/build/user-agent-strings.html">described at mozilla.org and at the Web Resources site. It includes some browser identification information, some operating system information and perhaps also its language. For historic reasons, IE pretends to be Netscape, which can be confusing.
• The navigator object has additional properties. Here's the whole story.

• forward() -- loads the next URL in the history list.
• go() -- loads a URL from the history list.

Lab

Your task:

• Make a copy of the example web page and add the following feature.
• Add code to detect the browser -- it's either "Netscape" or "Microsoft Internet Explorer". Depending on which browser is in use, invoke the appropriate history.back() method to back up the lower frame from the blue to the yellow.

Solution

Don't peek unless you're stuck!

• Run it.
• Source code:
  • main page
  • upper frame
  • lower frame