有以下HTML代码
<body>
<div id="div1">
<p>Hello world</p>
<a href="http://www.baidu.com" id="a_link">this is a link</a>
</div>
</body>
/-------------------------------------------------------
有以下CSS代码
<style type="text/css">
#div1{ background-color:#FFFF00;}
#div1 a:hover{ color:rgb(168,235,675); background-color:#FFF;}
#div1 a{ background-color:#00F; color:#000;}
</style>问题:
如何获取css中a:hover的值?
下面是我写的方式:
 var a_link = document.getElementById("a_link");
 var value =document.defaultView.getComputedStyle(a_link , ":hover").color;
但是获取的值是#00F的值,根本不是rgb的值。如何才能获取a:hover的值呢?或则说大多数开发中根本不需要获取a:hover中的值嘛?求高手解惑!!
以下是关于getComputedStyle这个方法的说明:
http://www.w3.org/2003/01/dom2-javadoc/org/w3c/dom/css/ViewCSS.html

解决方案 »

  1.   

    ff测试是可以的
    <body>
    <style type="text/css">
    #div1{ background-color:#FFFF00;}
    #div1 a:hover{ color:rgb(168,235,675); background-color:#FFF;}
    #div1 a{ background-color:#00F; color:#000;}
    </style>
    <div id="div1">
    <p>Hello world</p>
    <a href="http://www.baidu.com" id="a_link" onmouseover="a()">this is a link</a>
    <script>
    function a()
    {
    var a_link = document.getElementById("a_link");
    var value =document.defaultView.getComputedStyle(a_link , ":hover").color;
    alert(value)
    }
    </script>
    </div>
    </body>
      

  2.   

    请问楼上的,你是在FF那个版本测试的?我使用的版本是4.0.1的,但是获取的值是#div1 a{ background-color:#00F; color:#000;}中color的值,并不是a:hover中color的值!
      

  3.   

    本帖最后由 net_lover 于 2011-05-20 16:32:07 编辑
      

  4.   

    我测试也通过了。原因是没有使用onmouseover这样的方式来访问,直接是在window.onload中去访问,因此始终取得值是#div1 a{ background-color:#00F; color:#000;}中color的值。
      

  5.   

    那如何设置各种各样CSS伪类的值呢?
      

  6.   

    切换的效果,用JS把属性写到html中,比如第一个按钮的class=red,当点击第二个按钮的时候,第一个按钮的class=red就删掉,然后在第二个按钮中写上class=red。这要怎么实现?就是有个删除操作