Why use document.getElementById when I can directly refer to the DOM id in JavaScript? [duplicate]

Question

Possible Duplicate:
IE/Chrome: are DOM tree elements global variables here?

I recently discovered that I can use in javascript any object from DOM with a direct reference to its id:

<div id="layer">IM A LAYER</div>
<script>
   alert(layer.innerHTML);
</script>

If this is true, what advantage I'd get using the getElementById method?

Answer 1

Accessing a DOM element directly will give you a error if the element does not exist. Wheras if you use getElementById it will return NULL.

You also can't access all elements directly if they, for example, have dashes in their name (some-id), because JS variables can't contain dashes. You could however access tthem with window['some-id'].

Answer 2

for example, if in your page you have elsewhere another previous script with

<script>
var layer = false; // or any other assignment
</script>

layer will be a reference to window.layer, then layer.innerHTML will fail. With document.getElementById you will avoid this tricky errors

Answer 3

This will work only for id's containing letters allowed for variable names. For id's like text-11, or item-key-21 it won't work.