Ваш код не работает, потому что он нарушает политику безопасности по умолчанию . Я создал скринкаст одной минуты, чтобы показать, что не так:
Во-первых, я показал, как отладить проблему. Щелкните правой кнопкой мыши по вашей всплывающей кнопке и нажмите «Осмотреть всплывающее окно» . После этого вы увидите следующее сообщение об ошибке:
Отказано для выполнения встроенного скрипта, поскольку оно нарушает следующую директиву политики безопасности контента: «script-src» self 'chrome-extension-resource: ".
blockquote>Это объясняет, что ваш код не работает, потому что он нарушает CSP по умолчанию: Встроенный JavaScript не будет выполнен . Чтобы решить эту проблему, вам нужно удалить все встроенные JavaScript из вашего HTML-файла и поместить их в отдельный JS-файл.
Результат показан ниже:
hello.html
( всплывающая страница)
=a
popup.js
var a=0; function count() { a++; document.getElementById('demo').textContent = a; } document.getElementById('do-count').onclick = count;
Обратите внимание, что я заменил
innerHTML
наtextContent
. Научитесь использоватьtextContent
вместоinnerHTML
, когда вы намерены изменить текст. В этом простом примере это не имеет значения, но в более сложных приложениях это может стать проблемой безопасности в виде XSS.