大家帮我看看哪里出了问题-慕课网

大家帮我看看哪里出了问题

来源：10-1 编程挑战

梧桐笑

2017-09-06 23:19

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>实践题 - 选项卡</title> <style type="text/css"> /* CSS样式制作 */ *{padding:0px; margin:0px; font:14px normal "microsoft yahei";} #div1{ width:350px;padding:5px;height:150px;margin:20px; } #div1 ul{ list-style:none;display: block; height:45px;line-height:45px; border-bottom:2px saddlebrown solid; } #div1 ul li{ display:inline-block; list-style:none; width:80px; height:35px;line-height:35px; /*line-height与height相同时表示文字垂直居中*/ border:1px #c0c0c0 solid; margin:2px; background-color: #ff8000; float:left; text-align: center; } .hide{display:none;} #div1 ul .li1{background-color: #00ffff} </style> <script type="text/javascript"> // JS实现选项卡切换 window.onload=function(){ var div1=document.getElementById("div1"); var ul=div1.getelementsByTagName("ul")[0]; var lis=ul.getElementsByTagName("li"); var divs=div1.getElementsByTagName("div"); for(var i=0,len=lis.length;i<len;i++){ lis[i].index=i; lis[i].onclick=function(){ for(var j=0;j<len;j++){ divs[j].className="hide"; lis[j].className=""; } divs[this.index].className=""; this.className="li1"; } } } </script></head><body><div id="div1"> <ul> <li class="li1">房产</li> <li>家具</li> <li>二手房</li> </ul> <div > <a href="javascript:;">275万购昌平邻铁三居总价20万买一居</a><br> <a href="javascript:;">200万内购五环三居 140万安家东三环 </a><br> <a href="javascript:;">北京首现零首付楼盘 53万购东5环50平</a><br> <a href="javascript:;">京楼盘直降5000 中信府公园楼王现房</a><br> </div> <div class="hide"> <a href="javascript:;">40平出租屋大改造美少女的混搭小窝</a><br> <a href="javascript:;">经典清新简欧爱家 90平老房焕发新生</a><br> <a href="javascript:;">新中式的酷色温情 66平撞色活泼家居</a><br> <a href="javascript:;">瓷砖就像选好老婆卫生间烟道的设计</a><br> </div> <div class="hide"> <a href="javascript:;">通州豪华3居260万二环稀缺2居250w甩</a><br> <a href="javascript:;">西3环通透2居290万 130万2居限量抢购</a><br> <a href="javascript:;">黄城根小学学区仅260万 121平70万抛!</a><br> <a href="javascript:;">独家别墅280万苏州桥2居优惠价248万</a><br> </div></div> </body></html>

写回答关注