<!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>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。