原生js实现tab切换
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title><style type="text/css">*{margin:0;padding:0}a{ display:inline-block;*display:inline;zoom:1;padding:5px 15px; background:#ccc; margin-right:10px}.hide{ display:none}.show{ display:block}</style></head><body><a href="javascript:;">1</a><a href="javascript:;">2</a><a href="javascript:;">3</a><div>内容1</div><div>内容2</div><div>内容3</div><script type="text/javascript"> var btn=document.getElementsByTagName("a"),box=document.getElementsByTagName("div"); for(var i=0;i<btn.length;i++){ function tab(n){ btn[n]. for(var j=0;j<box.length;j++){ box[j].className="hide"; } box[n].className="show"; } } tab(i) } </script><script type="text/javascript">var btn=document.getElementsByTagName("a"),box=document.getElementsByTagName("div");for(var i=0;i<btn.length;i++){ (function(_i){ btn[_i]. //利用js闭包实现tab切换 for(var j=0;j<box.length;j++){ box[j].className="hide"; } box[_i].className="show"; } })(i);}</script></body></html>
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。