Understanding DOM (Document Object Model)

DOM stands for - Document Object Model

A Document object represents the HTML document that is displayed in a web page.
The Document object has various properties that refer to other objects which allow
access to and modification of document content.

The way that document content is accessed and modified is called the
Document Object Model, or DOM. The Objects are organized in a hierarchy.
This hierarchical structure applies to the organization of objects in a Web document.

It provides a structured representation of the document (a tree) and it defines a way
that the structure can be accessed from programs.it connects web pages to scripts or
programming languages.

Window object: Top of the hierarchy. It is the outermost element of the DOM hierarchy.

Document object: Each HTML document that gets loaded inside a window becomes a
document object. The document contains the content of the page.

Here is a simple hierarchy of few important objects:

Top most part ----------------------
bottom most part
So, if you want to access button you have to load form and then only  you can do stuffs on button , same for text and checkboxes