No, it’s not someone’s nickname - The Document Object Model, or “DOM” for short, is a programming interface for HTML and XML documents. Programming with the DOM is a big deal. It enables programmers to manipulate the page in various ways, such as:
The DOM is called an “object model” because it presents the page as an object. That “document object” contains an object representing each element. Element objects are nested from a root element to mirror the HTML structure of the page.
The first step with DOM programming is getting the elements themselves. Programming with the DOM makes one thing very clear: there is a difference between an element, a locator, and a selector.
To sum them up in one line: A locator uses a selector to find an element on a web page.
Why is this distinction important? Two main reasons:
For these reasons, we must separate the concerns of the element objects themselves and the locators used to find them.
There are many types of locators, such as:
We will cover different locator types in great detail in future chapters, as well as when to use which one. For now, just know that locators are the standard way for finding elements in a Web page, and that every element can have a unique locator. Also, know that a locator can return multiple elements, not just one - it will return all elements found that match its query.
Another browser automation tool that uses locators is Playwright. Unlike Selenium WebDriver, Playwright manipulates the browser using debug protocols. However, just like Selenium and Cypress, Playwright uses locators to find elements.
Regardless of the tool, you need to understand the DOM and know how to write good locators to develop automation.