spacer
Yehuda Shiran January 26, 2001
Extending setSrc() to Mozilla Browsers
Tips: January 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?

DOCJSLIB 1.0 includes three functions:

  • makeImage() creates an IMG element within a DIV element.
  • getSrc() returns the image's URL.
  • setSrc() sets the image's URL.

To adapt setSrc() to Netscape 6 and Internet Explorer 5.x, we need to use document.getElementByID instead of document.all and document.id. Here is the old version:

function setSrc(id, url) {
  if (NS4) {eval("document." + id + ".document." + id + "img").src = url}
  else {eval("document.all." + id + "img").src = url}
}

and here is the new version that supports both Netscape 6 and IE5.x:

function setSrc(id, url) {
  if (NS4) {eval("document." + id + ".document." + id + "img").src = url}
  else if (IE4) {eval("document.all." + id + "img").src = url}
       else if (IE5 || N6) {document.getElementById(id + "img").src = url};
}

The convention used in DOCJSLIB is that if a DIV element is labeled with a given ID, the ID of the IMG element within the DIV element is a concatenation of ID and the string "img". If the DIV's ID is "foo", for example, the IMG element within it will be labeled "fooimg". This is the reason we search above an IMG element that has an ID of id + "img".

The different browsers are detected via the following code:

var IE4 = (document.all && !document.getElementById) ? true : false;
var NS4 = (document.layers) ? true : false;
var IE5 = (document.all && document.getElementById) ? true : false;
var N6 = (document.getElementById && !document.all) ? true : false;


People who read this tip also read these tips:

Look for similar tips by subject:

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business