☰

Использование Chrome для создания правил AdBlock/UBlock

tag-icon • tag-icon google-chrome rules adblock google-chrome-devtools
Использование Chrome для создания правил AdBlock/UBlock

введите описание изображения здесь

Я хочу узнать, как использовать Chrome devtools для создания собственных правил блокировки рекламы в соответствии с синтаксисом Ublock/Adblock. Теперь, прежде чем я это сделаю, мне нужно разобраться, как работают Chrome dev tools.

Обратите внимание на картинку, пожалуйста. Весь этот элемент div — это то, что я хочу заблокировать. К сожалению, этот элемент div имеет идентификатор. Указанный идентификатор — это случайный салат из цифр и букв, который меняется каждый раз, когда вы перезагружаете страницу.

Как мне выяснить, как на самом деле называется «id», чтобы я мог создать правило блокировки только для этого конкретного идентификатора с этим конкретным именем?

Бонусные баллы, если вы сможете показать мне, как создать правило :P

решение1

Если Idгенерируется случайным образом каждый раз, вам нужно найти какое-то другое свойство, уникальное для этого элемента DOM, к которому можно привязаться. Текстовые свойства не очень хороши, поскольку вы надеетесь, что никакой другой узел не будет использовать текст, по которому вы фильтруете, и что нет перевода на основе локали.

Тем не менее, я использовал его в этом примере, потому что не уверен, что на этом сайте AllMusic, который вы используете, есть что-то лучшее.

С использованиемПодчеркиваниеfindС помощью функции можно выбрать дочерние узлы document.bodyи вернуть первый узел, содержащий в тексте словосочетание «ad block».

var blockElem = _.find(document.body.childNodes, function (elem) { 
    return elem.innerText && elem.innerText.toLowerCase().indexOf("ad block") != -1 }
);

Теперь у вас есть элемент DOM, которым вы можете манипулировать (удалять, скрывать и т. д.).

Альтернативное использованиеjQuery-ыfilterФункция:

var blockElem = $("body div").filter(function() {
    return $(this).text().toLowerCase().indexOf("ad block") != -1;
}).first();

P.S.Мне кажется, что этот вопрос больше подходит для StackOverflow.

решение2

Фильтр скрытия Adblock Plus состоит из двух частей:<domain>##<selector>

  • Доменная часть — это просто разделенный запятыми список доменов, на которых элементы должны быть скрыты.

  • Селекторная часть определяет, какие элементы следует скрыть, и следует заСтандартный селектор CSS. Поэтому вместо того, чтобы учиться писать фильтры, я бы посоветовал изучить селекторы CSS, поскольку существует множество полезных ресурсов о том, как их писать.

Например, в этом случае может быть полезно знать, что вы можете выбрать элемент на основе того, где он находится в документе. например, body > :nth-child(1)выберет первый элемент в теле. Для более конкретных селекторов вам нужно будет проверить, какие из его характеристик остаются постоянными, а какие изменяются.

Связанный контент