Это расширение Chrome в основном удаляет элементы DOM со страницы при нажатии на нее.
Недавно начал изучать способы начать создание расширения для Chrome и почувствовал, что расширение, управляющее DOM, будет лучшим местом для начала обучения.
В этом направлении построено это, где при наведении на элементы DOM будет добавляться стиль границы и при щелчке по этому элементу изменять непрозрачность на 0, чтобы элемент был скрыт, сохраняя макет страницы нетронутым.
Основной отправной точкой расширения Chrome является файл манифеста, в котором упоминаются метаданные расширения, такие как
1. Название расширения
2. Описание (расширения)
3. разрешения (такие как хранилище, вкладка и т. д.) (в этом расширении разрешение не требуется)
4. фоновый js (этот файл будет выполняться в фоновом режиме и будет прослушивать событие, такое как щелчок по значку расширения)
5. скрипты контента (этот файл js имеет доступ к DOM и может модифицировать DOM) (герой в этом компоненте) и т.д. и т.п.
Поскольку background.js постоянно работает в фоновом режиме браузера Chrome, его можно использовать для прослушивания любых событий, которые запускаются в любой момент времени, и могут использоваться для активации расширения.
Здесь API расширения Chrome используется для добавления обработчика события щелчка на значок расширения, а обработчик щелчка запрашивает активную вкладку со всех открытых вкладок и отправляет собственное сообщение, которое будет прослушиваться в сценарии содержимого для активации, как показано ниже.
При получении сообщения remove_element_clicked_browser_action он активируется, добавляя соответствующий прослушиватель событий (события наведения и щелчка) и создавая элементы DOM с двумя активными элементами (отменить удаление и закрыть расширение). В первый раз, когда его вызывают, он прикрепляет событие (активирует себя), а во второй раз, когда он вызывается, он удаляет прикрепленное событие (деактивирует себя). Здесь это обрабатывается установкой флага isActionClicked.
Также в массиве listOfHiddenElems хранится список последних 5 скрытых элементов, чтобы пользователь мог отменить действие удаления для последних 5 действий.
Подробнее, полный код можно найти здесь.
Я также опубликовал расширение, не стесняйтесь оформлять заказ и оставлять отзывы.
Справочная статья, которая поможет в сборке расширения — Официальный сайт Chrome
Постараюсь создать больше расширений и поделиться опытом здесь.
