jquery - 如何使用 jQuery 获得锚点的 :hover css 样式？

Question

如何使用 jquery 即时获取 css 样式表中的 :hover ？

愚蠢的例子：

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');
  }
);