Small Javascript Question

[Mtek]

Hi,

I have a form which puts out a hidden DIV like this:


<DIV id='invalid' style="display:none"><img src="../images/
flyer.jpg"></DIV>

So, the DIV is hidden until the customer performs some actions. Once
they do, I make the DIV appear like this:

document.getElementsByName('custphoto')[0].style.display="";

That works fine in IE. But Firefox gives this error:

Error: document.getElementsByName("custphoto")[0] has no properties

Why does that not work in Firefox, but does in IE? Can I make it
work in both browsers???

Thank you!

 

[RobG]

Hi,

I have a form which puts out a hidden DIV like this:

<DIV id='invalid' style="display:none"><img src="../images/
flyer.jpg"></DIV>

So, the DIV is hidden until the customer performs some actions. Once
they do, I make the DIV appear like this:

document.getElementsByName('custphoto')[0].style.display="";

Presumably that is a typo and you mean 'invalid' not 'custphoto'.

That works fine in IE. But Firefox gives this error:

Error: document.getElementsByName("custphoto")[0] has no properties

Why does that not work in Firefox, but does in IE?

Two good reasons:

1. IE does not understand that name and ID attributes are
actually different attributes

2. the div doesn't have a name attribute, it has an ID.
getElementsByName should get elements with the same name
attribute value, not elements with the same ID attribute
value

and one more for good measure:

3. A Div element in an HTML document is not specified as
having a name attribute, therefore you should not expect
getElementsByName (which belongs to the DOM HTML spec) to work.

Can I make it work in both browsers???

You can make it work in any browser that supports DOM 1 (which is
pretty much any browser released in the last 8 years or so) by using
getElementById:

document.getElementById('invalid').style.display = '';