This is a brief guide on how to code the
document object model so that it works in both
Internet Explorer and
Mozilla equally well.
I'll start with the most difficult area of the
document object model, how to get at
CSS.
Normally, you would access the properties of
CSS with the following code:
name_of_class.style.property = value
This is the name of the style you are modifying, followed by a
punctuation, followed by the word '
style', followed by another full stop, followed by the property you would like to modify. You then use an equals sign to assign the property a new value.
However, this doesn't work in
Mozilla, so instead you must add a line of code, it now looks like:
var class_name = document.getElementById('name_of_class')
class_name.style.property = value
What we have done here, is create a
variable and point it towards the
name_of_class style, we now use the variable name in place of the style name in the original code.
This method works for any object in the DOM, such as images; or indeed any tag with the code
name="desired_name" in. An example to help you:
We have an image, called John:
<img src="image.gif" name="thisisthename" />
We would like to change the image being shown. The
javascript code to be called should be:
var my_image = document.getElementById('thisisthename')
document.my_image.src="new_file_name.gif"
Works in both Mozilla and IE.