The first method involves searching for an element starting with a top-most node (like the document node) and moving downwards. You can move downwards, upwards, or sideways in the DOM tree from your selected node. Once you have access to a given node in the DOM tree, you can access its related nodes in different ways. As you can imagine, it's better to search from an already-known point on a map than do a full search.įor example, selecting a child element from its parent is easier and more efficient than searching for it throughout the entire tree. There are other methods you can use in conjunction, to navigate the DOM in more efficient and robust ways. You can use methods like document.querySelector() and document.getElementById() to do so.
You're probably already familiar with several methods for accessing elements in the DOM tree by their id, class, or tag name. Only through the DOM can you manipulate your HTML document structure, content, and style.ĭOM traversal (also called walking or navigating the DOM) is the act of selecting nodes in the DOM tree from other nodes. It provides an API that allows you, as the web developer, to interact with a website using JavaScript.Įvery item in the DOM is known as a node. The Document Object Model, or DOM for short, is a tree-like representation of an HTML document.