WHAT IS THE DOCUMENT OBJECT MODEL (DOM)?
• The DOM is and acronym for Document Object Model.
• its job is to describe the structure of a HTML document and the
relationship between different elements like tags, attributes, and texts on
• As you add, delete or modify existing elements on your website, you're
creating structure that a browser interprets as the DOM.
to define and modify the existing document.
• It's really best to think of the DOM as an upside down family tree.
• Every element in the DOM, including the text and attributes are
• Nodes can be both parent, and have children elements.
• Elements in the same level is known as siblings.
• The first and last children of an element have special names called first
child and last child.
• The rest of the children of the element are known as child nodes.
SELECTING ELEMENTS WITH GETELEMENTBYID
• It allows you to select and element in the HTML file
that is a tag that has a single ID attribute.
• getElementById() expects to find only one ID since an
ID should appear only once in each document.
CHOOSING ELEMENTS BY HTML TAG
• Traditionally, the easiest way to get to an element is by
ID, but you probably don't have an ID for every
element in the DOM.
• If getElementsByID is the most popular way to access
things, then getElementsByTagName is the next most
• GetElementsByTagName lets you access elements by
their HTML tags.
• It's super simple to use and returns an array.
WORKING WITH NAMED FORM ELEMENTS
• Selecting form elements is a little easier because forms
can have and additional attribute called Name.
• The DOM provides a special object called
• That's an array of form elements on the page.
• You can also get to any form element that has a name a
little bit easier.
• If I want to get into that element, I can say document
forms and then the index.