document.all vs. document.getElementById

document.all is a proprietary Microsoft extension to the W3C standard.

getElementById() is standard - use that.

However, consider if using a js library like jQuery would come in handy. For example, $("#id") is the jQuery equivalent for getElementById(). Plus, you can use more than just CSS3 selectors.

document.all is very old, you don't have to use it anymore.

To quote Nicholas Zakas:

For instance, when the DOM was young, not all browsers supported getElementById(), and so there was a lot of code that looked like this:

if(document.getElementById){  //DOM
    element = document.getElementById(id);
} else if (document.all) {  //IE
    element = document.all[id];
} else if (document.layers){  //Netscape < 6
    element = document.layers[id];
}

Actually, document.all is only minimally comparable to document.getElementById. You wouldn't use one in place of the other, they don't return the same things.

If you were trying to filter through browser capabilities you could use them as in Marcel Korpel's answer like this:

if(document.getElementById){  //DOM
    element = document.getElementById(id);
} else if (document.all) {    //IE
    element = document.all[id];
} else if (document.layers){  //Netscape < 6
    element = document.layers[id];
}

But, functionally, document.getElementsByTagName('*') is more equivalent to document.all.

For example, if you were actually going to use document.all to examine all the elements on a page, like this:

var j = document.all.length;
for(var i = 0; i < j; i++){
   alert("Page element["+i+"] has tagName:"+document.all(i).tagName);
}

you would use document.getElementsByTagName('*') instead:

var k = document.getElementsByTagName("*");
var j = k.length; 
for (var i = 0; i < j; i++){
    alert("Page element["+i+"] has tagName:"+k[i].tagName); 
}

document.all vs. document.getElementById

Related

Recent Posts