Как обнаружить нужные дочерние элементы в HTML через Javascript?

Оффтоп javascript
1

Как определить наличие нужных дочерних тегов (например, p, h1–h6, списки) в HTML элементе (div), используя чистый Javascript? Пример:

/* Функция проверяет, есть ли у переданного элемента нужные дочерние теги */
function имеетСодержимое(элемент) {
    const потомки = элемент.childNodes;
    for (let узел of потомки) {
        if (узел.nodeType === Node.ELEMENT_NODE && /^(P|H[1-6]|UL|OL)$/.test(узел.tagName)) {
            return true;
        }
    }
    return false;
}
2

Функция нормальная, но интересно, пробовали ли вы искать нужные теги и среди глубоко вложенных элементов? Может, стоит использовать рекурсию или метод querySelector для упрощения. Какие варианты кажутся вам более удобными для таких задач?

3

В опыте встречались задачи, где querySelector оказался предпочтительнее, так как позволяет одним запросом охватить все нужные элементы без ручного перебора. Но если нужны тонкие настройки или контроль, то классический обход childNodes работает отлично. В общем, важно понимать специфику задачи и выбирать между удобством и детальным контролем.

4

В своём опыте я столкнулся с похожей задачей. Мне приходилось выбирать между использованием рекурсии и методом querySelectorAll в зависимости от структуры страницы. Если элемент содержит вложенные блоки, querySelectorAll реально облегчает жизнь, но если нужна более тонкая настройка, лучше вручную проходить по DOM. Важно понимать, чего именно вы хотите добиться и даже небольшая разница в подходе может повлиять на производительность. Иногда приходится комбинировать оба подхода для оптимального результата.

5

Интересно, иногда я экспериментирую с разными методами. Можно комбинировать querySelector для простоты и рекурсию для глубокой проверки. Какой подход вы считаете более гибким в своих проектах?

6

В моём опыте я чаще использую querySelector для быстрого доступа к нужным тегам, но рекурсия помогает, когда структура документа достаточно сложная и нужно детально проверять каждый уровень вложенности. Если задача не критична по скорости, иногда комбинирую оба подхода. Главное – подобрать метод, который максимально точно решает поставленную задачу без лишних накладных расходов.