Я пытаюсь создать расширение для Chrome, которое «размывает» серию изображений на веб-странице. Я очень новичок во всем этом, и я просто хотел знать, был ли я на правильном пути.
Из того, что я видел, каждое изображение содержится в теге, который выглядит следующим образом:
<div class="Bdrs(8px) Bgz(cv) Bgp(c) Ov(h) StretchedBox Ir(p) Cnt($blank)::a StretchedBox::a Bg($inherit)::a Scale(1.3)::a Scale(1.2)::a--s Blur(12px)::a">
Чтобы изображение было не размытым, псевдокласс Blur (12px) необходимо изменить на Blur (0px). Я не получаю никаких результатов от того, что я пробовал, но я чувствую, что моя логика верна. Все, что я хочу сделать для расширения, это автоматизировать процесс использования "Inspect Element" для редактирования страницы.
var profilePic = document.getElementsByClassName("Bdrs(8px) Bgz(cv) Bgp(c) Ov(h) StretchedBox Ir(p) Cnt($blank)::a StretchedBox::a Bg($inherit)::a Scale(1.3)::a Scale(1.2)::a--s Blur(12px)::a");
for(var i = 0; i < profilePic.length(); i++) {
profilePic[i].classList.remove("Bdrs(8px) Bgz(cv) Bgp(c) Ov(h) StretchedBox Ir(p) Cnt($blank)::a StretchedBox::a Bg($inherit)::a Scale(1.3)::a Scale(1.2)::a--s Blur(12px)::a");
profilePic[i].classList.add("Bdrs(8px) Bgz(cv) Bgp(c) Ov(h) StretchedBox Ir(p) Cnt($blank)::a StretchedBox::a Bg($inherit)::a Scale(1.0)::a Scale(1.0)::a--s Blur(0px)::a");
}
Изображения на странице должны быть без размытия, но ничего не происходит. Возможно, мое расширение не настроено должным образом, поскольку я только начал изучать этот материал, но я надеялся, что кто-то еще с большим опытом сможет сказать мне, в порядке ли мой код.