js图片轮播和点击切换_js实现标签点击切换方法

【www.bbyears.com--js教程】

对于网站而言，相信很多人也非常清楚，网站里面很多的标签，每每点击之后就会切换了。那么大家知道这种效果是怎么实现的吗？下面文章就给大家介绍下js实现标签点击切换方法，具体实现的实例代码一起文章中了解。

本文实例讲述了JS实现的简单标签点击切换功能。分享给大家供大家参考，具体如下：

先来看看运行效果：

具体代码如下：

  
  
  



  
    体育
    娱乐
    新闻
    综合
  
  
    
      
我是体育模块
      我是娱乐模块
      我是新闻模块
      我是综合模块
    
  

<script>
  var box = document.getElementById("box");
  var spans = box.getElementsByTagName("span");
  var lis = box.getElementsByTagName("li");
  for (var i = 0; i < spans.length; i++) {
    spans[i].aaa = i;
    spans[i].onclick = function () {
      for (var i = 0; i < spans.length; i++) {
        spans[i].className = "";
        lis[i].className = "";
      }
      this.className = "current";
      lis[this.aaa].className = "current";
    }
  }
</script>

  

本文来源：http://www.bbyears.com/wangyezhizuo/136907.html