选项卡是非常通用的,很老套了。会用也理解了,但是还是没有有人指导那么深刻了
刚开的妙趣课堂的教程,对自己的选项卡学习做如下总结:
最不会的应该属于或者当前的 index 索引值吧
写了个最简单的HTML
<input type = "button" value = "1" /> <input type = "button" value = "2" /> <input type = "button" value = "3" /> <div>1111</div> <div>2222</div> <div>3333</div>
接下来看JS
window.onload = function(){ var obtn = document.getElementsByTagName("input"); var odiv = document.getElementsByTagName('div'); for(var i=0; i < obtn.length; i++){ obtn[i].index = i//获取当前的索引值 obtn[i].onclick = function(){ for(var i=0; i < obtn.length; i++){ obtn[i].style.background = ''; odiv[i].style.display = 'none' } this.style.background = 'red' odiv[this.index].style.display = 'block' //当前索引值对于显示的DIV } } }
需要注意的地方是, 获取input索引值,对应下面内容DIV的索引值