Расширение Chrome для замены двух файлов стилей CSS - PullRequest
0 голосов
/ 05 марта 2019

Я работаю над расширением Chrome, которое позволяет пользователю изменять CSS страницы, переключаясь между двумя CSS-файлами. Это моё первое расширение Chrome, я очень программирую на javascript и не уверен, что делаю. Я надеюсь, что вы можете помочь мне сделать эту работу правильно.

Это манифест.json:

    {
    "name": "Scorm Cleaner",
    "version": "1.0",
    "description": "Limpia temarios de ASIR Online!",
    "permissions": ["activeTab", "declarativeContent", "storage"],
    "background": {
      "scripts": ["background.js"],
      "persistent": false
    },
    "page_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"
    },
    "manifest_version": 2
  }

А это popup.html:

    <html>
<head>
    <script src="popup.js"></script>
    <link id="pagestyle" rel="stylesheet" type="text/css" href="default.css">
</head>
<body>
    <button id="ChangeCSS" href="ScormCleaner.css">Style 1</button>
    <button id="ChangeCSS" href="ScormQuestions.css">Style 2</button>

</body>
</html>

И popup.js:

document.addEventListener('DOMContentLoaded', function() {
  document.getElementById("ChangeCSS").addEventListener("click", handler);
});


function handler() {
  document.getElementById('pagestyle').setAttribute('href');
}

Это и изображение всплывающего окна, работающего на Chrome:

Всплывающий скриншот

Спасибо !!

1 Ответ

0 голосов
/ 05 марта 2019

Вы должны взглянуть на учебное руководство " Getting Started " от google, так как оно делает нечто очень похожее и является хорошим источником для начинающих.

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...