document.getElementById(“selAge”) Vs document.myForms.selAge

Question

What is difference between

document.getElementById(“selAge”) 
document.myForms.selAge

When to use which?

Answer 1

They are two different paths to the same goal, which one you use depends on your preference. Personally I would use document.getElementById(“selAge”) because if the structure of your HTML changes then it would still work.

Answer 2

document.myForms.selAge is part of the DOM specification and so should not be unnecessarily avoided in favour of getElementById. Use whatever is easier.

Answer 3

The second one is an absolute no-no! It first finds an element with id/name "myForms" and gets its child, with id/name "selAge". The first one finds any element with the id "selAge". Always use the first one ... because, someone, in the future may decide to put "myForms" into a div. Then you're in a fix.

Answer 4

document.getElementById() is the recommended way to get reference of elements. It's easier to use and also would not require any changes if you decide to change the Form name or Id. However, as it traverses the entire DOM tree, it is usually slower than the document.forms notation of referencing objects, so take this into account when doing a lot of such look-ups.

document.forms is also harder to use, as you need you to know the entire path to the object beginning from the document element.