В настоящее время я создаю расширение Chrome для дислексии и пытаюсь связать нажатие кнопки во всплывающем окне для расширения с изменением размера шрифта страницы в качестве начального шага, но у меня возникают проблемы с его работой.Проблема в том, что ничего не происходит при нажатии кнопки во всплывающем окне.
Вот HTML-код для всплывающего окна:
<!DOCTYPE html>
<html>
<head>
<style>
button {
height: 30px;
width: 30px;
outline: none;
}
</style>
</head>
<body>
<button id="changeFont"></button>
<script src="popup.js"></script>
</body>
</html>
Вот исходный файл для всплывающего HTML-файла:
let changeFont = document.getElementById('changeFont');
changeFont.onclick = function(element) {
chrome.tabs.executeScript({
code:
'var elements = document.getElementsByTagName('*');'+
'for (var i = 0; i < elements.length; i++) {' +
'var element = elements[i];' +
'element.style.fontSize = "50px";'+
'}'
});
};
Наконец, вот файл манифеста:
{
"manifest_version": 2,
"name": "Dyslexipro",
"description": "dyslexia aid ",
"version": "1.0",
"permissions": ["activeTab",
"tabs","declarativeContent","storage"],
"browser_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/get_started16.png",
"32": "images/get_started32.png",
"48": "images/get_started48.png",
"128": "images/get_started128.png"
}
},
"icons": {
"16": "images/get_started16.png",
"32": "images/get_started32.png",
"48": "images/get_started48.png",
"128": "images/get_started128.png"
},
"background": {
"scripts": ["content.js","popup.js"],
"persistent": true
}
}