On IE document.getElementsByName won't work

23,360

Solution 1

Well, the problem is this: IE understands document.getElementsByName(...)[0] as document.getElementById(...). So if you would define also an id for your element, the method document.getElementsByName(element_name)[0].innerHTML="" will surprisingly also work in IE!

But since you anyway need to define an id due to IE, and since an id must always start with a char first, you must use:

<div id="a234">
    <img src="pic.gif" height="70" width="100" onMouseOver="clear('a234')">
</div> 

And this command:

function clear(element_id){
    document.getElementById(element_id).innerHTML="";
}

Even more, document.getElementsByName(...)[0] is slower in Firefox: http://www.uize.com/tests/performance/getElementById-vs-getElementsByName.html

So the id definitely wins the race.

UPDATE:

Also important is the fact, that we can adress every id by #a234{...} in a CSS file. So we can define an own style for every id, and this makes the id even more powerful.

Solution 2

Using getElementsByName to get a DOM Element where the name attribute is not part of the W3C spec (eg, in the question, name doesn't exist for DIV element), IE doesn't get those elements. FF does it.
Just to clarify: expando attribute or better known as custom attribute is what I am talking about attributes that are not part of the W3C spec.

Read: getElementsByName in IE7
Read: http://msdn.microsoft.com/en-us/library/ms536438(VS.85).aspx

So in conclusion:
Use getElementsByName when trying to get "Form Controls" (input, select, textarea) because they have name as an attribute according to the spec.
If the elements are not Form Controls, use getElementById instead.

Share:
23,360
Marcus
Author by

Marcus

Epic Linus@Google: http://www.youtube.com/watch?v=4XpnKHJAok8

Updated on September 20, 2020

Comments

  • Marcus
    Marcus almost 4 years

    I use this code:

    <div name="1234">
       <img src="pic.gif" height="70" width="100" onMouseOver="clear('1234')">
    </div> 
    

    And:

    function clear(element_name){
        document.getElementsByName(element_name)[0].innerHTML="";
    }
    

    It does work in Firefox and Opera, but doesn't work in IE 6.0 or IE 8.0, and probably not even in newer IE's.

    What to do?

  • Jeremy J Starcher
    Jeremy J Starcher over 11 years
    Worth pointing out that an ID isn't allowed to start with a number.
  • Marcus
    Marcus over 11 years
    Oh yeah, thanks. More details here: stackoverflow.com/questions/4247840/…