如何使用 jQuery 获取锚点的 :hover css 样式？

Question

如何使用 jquery 动态获取 :hover in css 样式表？

愚蠢的例子：

a.foo {
    color: red;
    font-size: 11px;
}

a.foo:hover {
    color: blue;
    font-size: 12px; 
}

如何在鼠标越过锚点之前检索颜色和字体大小？

Answer 1

如果确实需要，可以通过 document.styleSheet 属性访问此信息。 此处提供了一个示例： http://jsfiddle.net/Xm2zU/1/

请注意 IE需要自己的代码来执行此操作，因为它使用“.rules”而不是“.cssRules”等。

Answer 2

查看jQuery 的额外选择器。

此外，您还可以使用 hover 事件，具体取决于您想要实现的目标。 请参阅：jQuery 悬停和类选择器。

Answer 3

如何在鼠标移过锚点之前检索该颜色和字体大小？

不可以。在将鼠标悬停在 :hover 伪类上之前，您无法检索该元素的样式声明。 这是因为 JavaScript 只能使用 DOM 与 HTML 交互。 除非鼠标悬停在元素上，否则样式信息（针对悬停状态）不可用于 DOM，因此您无法检索这些值（即使通过模拟悬停状态）。

Answer 4

您可以使用 .hover() 函数代替。
http://api.jquery.com/hover/

$( "a.foo" ).hover(
  function() {
    $( this ).css( 'color','red' );
  }, function() {
    $( this ).css( 'color','blue');
  }
);