Всем привет пишу своё мини - расширение для браузера!
Вот мой 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
Как её исправить?