Can you test JS by color?

ByLimonade44

Can you run a script in your browser that, for example, hides all blue buttons on a website?

Is it possible to create a script that hides the entire block whenever a blue button appears in a block?

So that would only change the appearance of your own page, nothing on the server, just which part of the website you see! For example, you could always automatically hide the sports section of a news page, or something like that.

(1 votes)
Loading...

Similar Posts

Canonical tag for 3 "same" online shops?

Byyoungck99

Hello folks, I have three online shops (in the German-speaking region) with the same products and content. However, it's difficult to write SEO texts for approximately 20 categories and approximately 100 pages without creating duplicate content, since it's always the same. However, I want each shop to rank well on Google in its respective country….

Subscribe
Notify of
9 Answers
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
medmonk
medmonk
4 months ago

Yes, that can be implemented with JavaScript. Basically, only the color space is split and then the desired changes are made using the values.

const blueDetection = () => {
  const [r, g, b] = rgb.match(/\d+/g).map(Number);
  return b > 100 && (b - r > 50) && (b - g > 50);
}

In the next step, keep writing more functions, what exactly should happen. Be it edit, remove, and what else you want to do with it.

You can also create or query other color spaces in which you can not only see/filter the colors used by RGB. It ultimately depends on yourself how far you expand and apply your script with features.

2
Limonade44
Author
Limonade44
4 months ago
Reply to  medmonk

Can you hide the Parent Element as a result? And if so, how?

0
medmonk
medmonk
4 months ago
Reply to  Limonade44

This is also possible and JavaScript already brings everything necessary. For this with the DOM methods/properties closest and/or parentelement can work.

const parentElement = this.closest('.child');

Your function could look like this:

const removeBlueElements = () => {
  document.querySelectorAll('*').forEach(element => { 
    const bgColor = window.getComputedStyle(element).backgroundColor; 

    if (blueDetection(bgColor)) {
      element.closest('*')?.remove();
    } 
  }); 
};

With the universal selector (*), hold each higher-level element and then indicate that it is to be removed. In the if conditions, include your function to check the color and negotiate everything else.

1
slaxxer
slaxxer
4 months ago
Reply to  medmonk

could make n Cronjob drauß to automate this

0
Limonade44
Author
Limonade44
4 months ago

Thank you.

0
medmonk
medmonk
4 months ago

Oh, almost forgotten. If you’re using Tempermonkey, you’ll have to insert jQuery beforehand. You might have to look again, as I have done nothing with this extension myself.

// ==UserScript== 
// @name Blue Element Remover // 
// @require https://code.jquery.com/jquery-3.6.0.min.js 
// ==/UserScript==
1
Limonade44
Author
Limonade44
4 months ago

Thank you.

1
medmonk
medmonk
4 months ago

It doesn’t change much:

const blueDetection = (rgb) => { 
  const [r, g, b] = rgb.match(/\d+/g).map(Number); 
  return b > 100 && (b - r > 50) && (b - g > 50); 
};

const removeBlueElements = () => { 
  $('*').each(function() { 
    const bgColor = $(this).css('background-color'); 

    if (blueDetection(bgColor)) {
      $(this).closest('*').remove(); 
    } 
  }); 
};

It will QuerySelectorAll by $(”)and window.getComputedStyle(element) by $(element).css(‘background-color’) replaced. Everything else remains unchanged.

At the end, the actual function call has to come. Say the instruction to run the browser, these or those functions.

$(document).ready(function(){ 
  removeBlueElements(); 
  // more functions... 
});

Nevertheless, you would be advised to read the basics of JavaScript. Otherwise ask questions about questions and do not really understand. Alternatively, use ChatGPT to help you explain something more.

LG medmonk

1
Limonade44
Author
Limonade44
4 months ago

Is this about Jquery? Because I can only Jquery :/ or only go with Javascript. I ask because I would like to understand the code and Javascript is too high. Thank you in any case, if you have the nerve to translate it in Jquery, I would be twice grateful to you:) How to use the JS in the Tampermonkey Framework or how that was called a plugin in Firefox? LG

0