Change :hover CSS properties with JavaScript

标签：tag   html   following   hang   ret   access   app   script   find   

I need to find a way to change CSS :hover properties using JavaScript.

For example, suppose I have this HTML code:

<table>
  <tr>
    <td>Hover 1</td>
    <td>Hover 2</td>
  </tr>
</table>

And the following CSS code:

table td:hover {
background:#ff0000;
}

I would like to use JavaScript to change the <td> hover properties to, say, background:#00ff00. know I could access the style background property using JavaScript as:

document.getElementsByTagName("td").style.background="#00ff00";

But I don‘t know of a JavaScript equivalent for :hover. How do I change these <td>‘s :hover background using JavaScript?

var css = ‘table td:hover{  padding: 0px; border: 0px; color: rgb(48, 51, 54);">;
style = document.createElement(‘style‘);

if (style.styleSheet) {
    style.styleSheet.cssText = css;
} else {
    style.appendChild(document.createTextNode(css));
}

document.getElementsByTagName(‘head‘)[0].appendChild(style);

Change :hover CSS properties with JavaScript

标签：tag   html   following   hang   ret   access   app   script   find   

原文地址：http://www.cnblogs.com/woodyliang/p/6484646.html