Как победить contentscript.js:31 Uncaught TypeError: Cannot read properties of null (reading 'querySelector')

Question

Есть простейший код:

<body>
    <h1>foo</h1>
    <script>
      let foo = document.getElementsByTagName("h1");
      function cons() {
        console.log(foo);
      }
      foo.onclick = cons;
    </script>
  </body>

Клик на h1 не работает, в консоли ошибка Uncaught TypeError: Cannot read properties of null (reading 'querySelector'). Почему null не пойму. Через консоль к переменной foo обратиться могу.

Answer 1

При использовании getElementsByClassName вы получаете не елемент, а HTML коллекцию https://developer.mozilla.org/ru/docs/Web/API/Document/getElementsByClassName
Решить проблему можно так:

const foo = document.getElementById('title');
function cons() {
    console.log(foo);
}
foo.onclick = cons

<h1 id="title">foo</h1>

БЛОГ НА HUSL

Как победить contentscript.js:31 Uncaught TypeError: Cannot read properties of null (reading 'querySelector')

Ответы (1 шт):