我要坚持11
2017-05-08 10:54
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>实践题 - 选项卡</title> <style type="text/css"> /* CSS样式制作 */ * {margin:0px;padding:0px; font:14px/1.5 arial} ul,li{list-style:none} .wrap{width:300px; height:180px;margin:20px auto;} .hide{display:none} #tab_t{height:33px; border-bottom:2px solid #FC0} #tab_t li{float:left;width:80px; height:32px; margin:0 3px; line-height:33px; text-align:center; border:1px solid #999; border-bottom:none; cursor:pointer; background:#ECECEC} #tab_t .act{position:relative; height:33px; border-top:2px solid #FC0;margin-bottom:-2px; background:#FFF} #tab_c{ height:145px; border:1px solid #00F; border-top:none} </style> <script type="text/javascript"> var tab_t=document.getElementById("tab_t"); var tab_c=document.getElementById("tab_c"); var li=tab_t.getElementsByTagName("li"); var Div=tab_c.getElementsByTagName("div"); for(var i=0;i<li.length;i++){ li[i].index=i; li[i].onclick=function(){ for(var j=0;j<li.length;j++){ li[j].className=''; Div[j].className='hide'; } li[this.index].className='act'; Div[this.index].className=''; } } </script> </head> <body> <!-- HTML页面布局 --> <div> <ul id="tab_t"> <li>房产</li> <li>家居</li> <li>二手房</li> </ul> <div id="tab_c"> <div>275万购昌平邻铁三居 总价20万买一居 <br/>200万内购五环三居 140万安家东三环<br/> 北京首现零首付楼盘 53万购东5环50平<br/> 京楼盘直降5000 中信府 公园楼王现房 </div> <div>40平出租屋大改造 美少女的混搭小窝<br/> 经典清新简欧爱家 90平老房焕发新生<br/> 新中式的酷色温情 66平撞色活泼家居<br/> 瓷砖就像选好老婆 卫生间烟道的设计 </div> <div>通州豪华3居260万 二环稀缺2居250w甩<br/> 西3环通透2居290万 130万2居限量抢购<br/> 黄城根小学学区仅260万 121平70万抛!<br/> 独家别墅280万 苏州桥2居优惠价248万 </div> </div> </div> </body> </html>
为什么不能运行呢,有大神给我看一下,我自己实在找不到哪错了
javascript部分加上window.onload=function(){ ... ... } //页面加载完成时运行函数
后两个div 加上类 class="hide" // 初始时显示第一个div ,后两个隐藏。
Uncaught TypeError: Cannot read property 'getElementsByTagName' of null
at h170505.1.html:20
JavaScript进阶篇
468782 学习 · 22507 问题
相似问题