Как найти все элементы на странице?

Question

Для поиска всех элементов на странице используют:

document.querySelectorAll('*') — возвращает все элементы (узлы) в виде коллекции.
document.getElementsByTagName('*') — старый метод, работает аналогично, но возвращает "живую" коллекцию.

Оба метода находят все элементы, включая <html>, <head>, <body> и их содержимое.

YeaHub · Accepted Answer

1. document.querySelectorAll('*')Современный метод, поддерживает CSS-селекторы. Возвращает статическую коллекцию (не обновляется при изменении DOM).const allElements = document.querySelectorAll('*');
console.log(allElements.length); // Число элементов на странице2. document.getElementsByTagName('*')Работает во всех браузерах, но возвращает "живую" коллекцию (изменяется при обновлении DOM). Менее удобен для сложных выборок.const allLiveElements = document.getElementsByTagName('*');
console.log(allLiveElements.length); // Тоже все элементыОсобенности:querySelectorAll медленнее на больших страницах, но гибче.getElementsByTagName быстрее, но не поддерживает сложные селекторы (например, '.class').Пример использования:// Найти все элементы с классом "button"
const buttons = document.querySelectorAll('.button');

// Найти все div на странице
const divs = document.getElementsByTagName('div');