I want to read the CSS property with pseudo classes. For ex in my case :hover
of a given element. I've used getComputedStyle
but is not returning the desired value.
Here's the HTML code:
<html>
<head>
<style>
#lo {
color: green;
}
#lo:hover {
color: black;
}
</style>
</head>
<body>
<h1 class="yo" id="lo">hello</h1>
</body>
</html>
Here's the JS:
let element = document.getElementById("lo");
console.log(window.getComputedStyle(element,':hover').getPropertyValue("color"));
It returns rgb(0, 128, 0)
instead of black
.
How to read the correct property value? Is there any other workaround for this?