Как можно повесить display none на div если тег h2 в нем содержит «hello»?

Question

[ynashyvan]

Как можно реализовать это самым простым способом?

Answer 1

[twobomb]

Array.from(document.querySelectorAll("div h2")).filter(e=>e.innerHTML == "hello").forEach(e=>e.parentNode.style.display="none");

Comments

[twobomb]

Александр, 3 раза?

[Александр]

twobomb, 1 - Array.from, 2 - fitler, 3 - forEach.

[twobomb]

Александр,
1 - хрен его знает как оно внутри устроено, в любом случае оно нативное и быстрее, тем более сколько туда элементов попадет, врядли на странице будет даже больше пяти h2.
2 - ок
3 - тут уже будет цикл только по отфильтрованным, тоесть огрызок от того что было в filter, если конечно они не все были hello.
P.S. Так то можно сказать что 4 цикла еще и document.querySelectorAll. А может там внутри еще 3 цикла, найти бы нативную реализацию хотябы в хромиуме...

Answer 2

[Александр]

Как вариант:

document.addEventListener('DOMContentLoaded', () => {
  const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);
  
  while (walker.nextNode()) {
    const node = walker.currentNode;
    
    if (/^hello$/i.test(node.textContent.trim())) {
      node.parentNode.closest('div').hidden = true;
    }
  }
});

Comments

[twobomb]

Тут вообще что-то страшное, что не выполняет поставленную задачу. Сказано же display none повесить, а тут hidden зачем-то.. 17 итераций на 6 тегов, вообще уникально, можно было еще на соседние страницы сходить и там попроверять

[Александр]

twobomb, hidden на style.setProperty поменять дело двух секунд. Однако, пример тут показывает обработку нод текста, которые нельзя выбрать при помощи querySelector. А если, оторваться от h2, так и вообще становится, на мой взгляд, единственным решением.

[twobomb]

Александр, Да тут вся задача дело двух секунд. Вас попросили попросили построить самокат, а вы монстр трак собрали.