Если нужно убрать фон для всех элементов у которых фон белый или близок к белому, то вполне можно проверять все элементы на предмет цвета, а потом раздавать им ваш цвет.
Можно например так:
1. Собрать все нужные элементы. Т.к. белые цвета фона используются чаще для контейнеров, то и собирать можно только соответствующие, типа div, main, footer, header и т.д.
2. Рассортировать элементы по цветам,
3. Отсеять группы элементов, не соответствующие по цвету. Цвет не соответствует критериям, при которых он считается белым, если 1) его недостаточно хорошо видно - высокий уровень прозрачности и 2) сумма цветовых компонентов недостаточно высока, цвет достаточно далёк от оттенка который можно было бы назвать белым,
Пример кода// white_like_thresold - minimal accepted value of color/white rate, colors that has higher rate is treated as white
// min_transparency - minimal accepted transparency (alpha), colors that has lesser transparency is treated as transparent
(function() {
const rgb_max_intens_sum = 255 + 255 + 255;
RegExp.integers = /\d+(\.\d+)?/g;
var accepted_tags = ['article','aside','footer','header','hgroup','nav','section','div','main','pre','table','form'],
white_like_thresold = 0.9,
min_transparency = 0.3,
bg_color = '#fafbfc',
$$result_collection = [];
collectElements();
setColor();
function collectElements() {
var background_color_key = 'background-color',
rgba,
color,
collections = {},
$$all = document.querySelectorAll(accepted_tags.join(','))
for (var l = $$all.length, i = 0; i < l; i++) {
color = getComputedStyle($$all[i])[ background_color_key ];
if (!(color in collections)) {
collections[ color ] = [];
}
collections[ color ].push( $$all[i] );
}
for (color in collections) {
rgba = color.match( RegExp.integers ).map(Number);
if ((rgba.length === 4 && rgba[3] < min_transparency) || (rgba[0]+rgba[1]+rgba[2])/rgb_max_intens_sum <= white_like_thresold) {
continue;
} else {
$$result_collection = $$result_collection.concat( collections[color] );
}
}
}
function setColor() {
var i = $$result_collection.length,
$el;
while (i--) {
$el = $$result_collection[i];
if (!$el._old_style) {
$el._old_style = {
backgroundColor: $el.style.backgroundColor
};
}
$el.style.backgroundColor = bg_color;
}
}
})();
Если кажется, что алгоритм оперирует со слишком большим количеством элементов, то достаточно сказать, что если брать в качестве примера эту страницу, то в результате выполнения было найдено 287 элементов из которых было сформировано 7 цветовых групп, из которых в свою очередь критерию соответствовали только 24.
Простой
