最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
原生js实现选项卡功能
时间:2017-06-06 编辑:简简单单 来源:一聚教程网
效果图:
代码如下:
代码如下 | 复制代码 |
#div1 div{width: 200px;height: 200px;border: 1px solid #FF0000;display: none;} .active{background: red;}
window.onload=function(){//原生js选项卡写法 var oDiv = document.getElementById('div1'); var aInput = document.getElementsByTagName('input'); var aCon = oDiv.getElementsByTagName('div'); for(var i=0;i aInput[i].index= i; aInput[i].onclick=function(){ for(vari=0;i aInput[i].className=''; aCon[i].style.display='none'; } this.className='active'; aCon[this.index].style.display='block'; } } }
333333333333
|
相关文章
- js选项卡的制作方法 03-03
- extjs 中选项卡按钮在下方实现方法 12-21
- extjs4中操作选项卡用法 12-21
- extjs 分组式选项卡实现代码 12-21
- extjs 可拖动的选项卡实现方法 12-21
- 一款js选项卡效果(兼容ie6,ie7,firefox) 12-03