解决IE7以下版本不支持无A状态伪类的几种方法

在IE7以下版本一直是不支持无A状态伪类的，通常都要靠Javascript来解决的，最近经常有人问起此类问题，故整理了几种方法，脚本来自国外网站，供大家参考。

方法一

javascript文件，来自Htmldog .

脚本可改动的部分

1. //这里写入你需要效果的标签
2. suckerfish(sfHover, "INPUT");
3. suckerfish(sfFocus, "INPUT");
4. suckerfish(sfHover, "p");

CSS

1. input:focus,input.sffocus {
2. background: #F8F8F8;
3. color: #333333;
4. border: 1px solid red;
5. }
6. input:hover,input.sfhover{
7. background: #EEE;
8. color: #369;
9. border: 1px solid #069;
10. }
11. p:hover,p.sfhover{
12. background: #EEE;
13. color: #333;
14. border: 1px solid #069;
15. }
16. p:hover,p.sfhover{
17. background: #EEE;
18. color: #333;
19. }

上面代码中第一个类是给支持CSS2的浏览器，第二个是给IE6及以下版本的。需注意的是，你给某标签设定了，那么整个页面内的这个标签都会沿用同一个样式。

方法二

javascript文件.

脚本可改动的部分

1. if (allElements[i].className.indexOf('hovereffect') !=-1)

CSS

1. .hovereffect{
2. Background: #CCC;
3. }

在需要应用效果的地方用class="hovereffect"调用。这种方法比较灵活。

方法三

使用网上常见的onmouseover、onmouseout这类东西，行为和结构不分离，不推荐使用。