Greasy Fork is available in English.

Discussies » Ontwikkeling

Can't change table row background color

§
Geplaatst: 09-04-2021
Bijgewerkt: 09-04-2021

https://myanimelist.net/topanime.php

Simply setting the background color css doesn't work.
document.querySelector("tr.ranking-list").style.backgroundColor = 'rgb(255 142 144 / 30%)'

I don't know why.

woxxomMod
§
Geplaatst: 09-04-2021

The inner td cells define their own background color via CSS as you can see in devtools inspector.

If you want to modify single rows individually, first reset the background on cells:

GM_addStyle(`
  .ranking-list td {
    background: none !important;
  }
`);

If you want to modify all rows then instead of querySelector just change the style globally:

GM_addStyle(`
  .ranking-list {
    background-color: rgb(255 142 144 / 30%);
  }
  .ranking-list td {
    background: none !important;
  }
`);
§
Geplaatst: 09-04-2021
Bijgewerkt: 09-04-2021

@wOxxOm

Thanks!

But how can I do this programmatically?

woxxomMod
§
Geplaatst: 09-04-2021

The first one is perfectly fine and is better than the second one, which needs to use a different method: a => a.style.setProperty('background', 'none', 'important')

§
Geplaatst: 09-04-2021

Thanks!

Reactie plaatsen

Log in om antwoord te geven.