2

I have a below HTML file and when I manually move cursor on the dummy link, it shows me yellow color, as I have added that style on css hover. Same I would like to simulate with java script. Here below is the image for reference.

image

Please suggest me how to achieve it?

<!DOCTYPE html>
<html>
<head>
<style>
a:hover {
   background-color: yellow;
}
</style>
</head>
<body>

<a href="https://####">dummylink</a>

<p><b>Note:</b> The :hover selector style links on mouse-over.</p>

</body>
</html>
Developer
  • 21
  • 1

1 Answers1

3

Use the mouseover and mouseout events:

const a = document.querySelector('a');
a.onmouseover = () => a.style.backgroundColor = 'yellow';
a.onmouseout = () => a.style.backgroundColor = null;
<a href="https://####">dummylink</a>
CertainPerformance
  • 356,069
  • 52
  • 309
  • 320
  • How do I know the color of element and which style was added for hover.I just want to do the same action which I did manually with javascript i.e mouse hover.Actually it is for Regression testing in which we automate the actions to test the functionalities. – Developer May 04 '18 at 05:41
  • If you want to assign the color string to a variable and use it elsewhere, feel free to do so. – CertainPerformance May 04 '18 at 05:49