如何使用JavaScript或jQuery获取td值的字体颜色或文本颜色

Question

I'm getting values of td if it contains "searched string" using

var t1=$(this).find('tr:has(td:first-child:contains("Error"))');
alert($(this).find('tr:has(td:first-child:contains("Error"))').css === "red"));
if (t1.length) {
    str =t1.text().trim();
    str = /:(.+)/.exec(str)[1];
    errorArray.push(str);
    // alert(str);
}

It is working fine. Now I want to add one more condition. How will I check for font colour of that. If it is equal to red then to proceed.Kindly help. If that can't be done then help me in searching for "Error" now how will I check using criteria "Match whole word" . Search only for that particular string if any td has. If any td contains "Errorrr" it shouldn't consider that.

Answer 1

Check it... think, this is what yo need

 $('table tr td').on('click',function(){ alert($(this).css('background-color')); }) 

 table tr td{ border:solid 1px; padding:2px} table tr td:nth-child(even){ background-color:#ff3} 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tr> <td>first</td> <td>second</td> <td>third</td> <td>fourth</td> </tr> </table> 

Answer 2

Here it is without JQuery, using getComputedStyle() . With this function you can get the actual style that is, after all the cascades and overwriting is done, rendered on the page:

const td = document.querySelector("table tr td"); // you can use JQuery here, if that makes you happy, or whichever way to select the element from the DOM.
const colour = getComputedStyle(td).backgroundColor;

console.log(colour);

This way you can get any actual, rendered CSS attribute from any element. The only caveat is to replace the kebab-case with camelCase ( background-color -> backgroundColor ).