Uncaught TypeError: Cannot set property 'innerHTML' of null — как получить DOM?

Всем привет пишу своё мини - расширение для браузера!
Вот мой panel.html:
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/main.css">
</head>
<body>
    <ul class="nav__extensions">
        <li><a id="main" href="">Главная</a></li>
        <li><a id="vk_parse" href="">vk parse</a></li>
        <li><a id="facebook_parse" href="">facebook parse</a></li>
        <li><a href="">О нас</a></li>
        <li><a href="">Контакты</a></li>
    </ul>

    <div class="items_extensions" id="items_extensions">23423423</div>


</body>
</html>
<script src="background.js" defer></script>

Вот background.js:
window.onload = () => {
var requestURL = "http://mvs.com/feed/ajax";
var request = new XMLHttpRequest();
request.open('POST', requestURL)
request.responseType = 'json';
request.send()
request.onload = function() {
    var superHeroes = request.response;
    populateHeader(superHeroes);
}

function populateHeader(jsonObj) {
    const items = document.querySelector(".items_extensions")

    for (var key in jsonObj) {
        items.innerHTML = jsonObj[key]
        console.log(jsonObj[key])
    }

    console.log(jsonObj)
    console.log(items)
    // for (let i = 0; i < jsonObj.options.length; i++) {
    //     console.log(jsonObj.options[i])
    // }
}
}


Ошибка в консоли:

Uncaught TypeError: Cannot set property 'innerHTML' of null
at populateHeader (background.js:16)
at XMLHttpRequest.request.onload (background.js:9)
populateHeader @ background.js:16
request.onload @ background.js:9
load (async)
window.onload @ background.js:7
load (async)
(anonymous) @ background.js:1


Как её исправить?
  • Вопрос задан
  • 128 просмотров
Пригласить эксперта
Ответы на вопрос 1
delphinpro
@delphinpro Куратор тега JavaScript
frontend developer
const items = document.querySelector(".items_extensions")

Перед использованием нужно проверить — а действительно ли в переменной то, что мы ожидаем?
В вашем случае — там null, т.е. элемент на странице не был найден во время исполнения данного кода.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы