@BratInt

Расширение, меняющее цвет посещённых ссылок -?

Добрый день.
Проблема в следующем.
Есть некий сайт, на котором стили настроены так, что цвет посещённых и непосещённых ссылок практически один и тот же.
Чтобы было сразу видно, какие ссылки на этом сайте я уже посещал, решил набросать расширение для браузера (Chromium), делающее цвета более различными.
Вначале хотел сделать цикл, пробегающий все тэги "a", и меняющий их стиль. Но, как оказалось, через JS невозможно изменить стиль посещённых ссылок.
Тогда я решил сохранить CSS файл к себе на компьютер, изменить его, и скриптом расширения менять адрес, чтобы он указывал на локальный файл. Но и этот вариант не сработал, т.к. открытые из интернета веб-страницы не могут получать доступ к локальным файлам. При том, что если сохранить веб-страницу с данного сайта на компьютер и открыть её в браузере, то с ней это же расширение будет работать так, как надо.
Вопрос: какие ещё существуют способы решения данной задачи?
  • Вопрос задан
  • 81 просмотр
Решения вопроса 1
Aleksandr-JS-Developer
@Aleksandr-JS-Developer
Лучше проще, чем никогда
Пара строк на js, добавлять в inject.js

function putCSSRules(CSSRules){
  const head = document.querySelector('head');
  const style = document.createElement('style');

  style.type = 'text/css';

  style.appendChild(document.createTextNode(CSSRules));
  head.appendChild(style);
}

putCSSRules(`a:visited{color: #f00;}`);


И да будет с вами счастье и красные посещенные ссылки.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
Alexandroppolus
@Alexandroppolus
кодир
Обычно ставят плагин вроде этого, в нем указывают кастомный css для a:visited, и всё.
Ответ написан
Aetae
@Aetae
Тлен
Для таких вещей нет смысла ажно целое расширение писать, есть юзерскрипты: ставишь tempermonkey и сразу пишешь код.

Конкретно задача обычно решается добавлением inline стиля(не важно в юзерскрипте или в расширении), примерно как показал Александр .
У меня в глобальном юзерскрипте для этого такая функция пошарена) :
tm_css(css, important) {
  if(important) {
    css = css.replace(/(?=[^\n\S]*;[^\n\S]*\n|[^\n\S]*\n[^\n\S]*\})/g, ' !important');
  }
  (document.body||document.head||document.documentElement)
    .insertAdjacentHTML('beforeend', `<style is="tm_css">${css}</style>`);
}


Однако в расширении таки можно подключать локальные ресурсы(не рандомные, а самого расширения, но всё же).
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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