求助大神!可能是對代碼不理解,為什么顯示不出效果呢
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實踐題 - 選項卡</title>
? ? <style type="text/css">
? ? ?/* CSS樣式制作 */ ?
? ? ? ?*{padding:0;margin:0;list-style:none;font-size:13px;text-decoration:none;color:#333;}
? ? ? ?#all{width:300px;}
? ? ? ?#ul1{border-bottom:2px solid #8B4513;height:32px;padding-left:10px;}
? ? ? ?#ul1 li{float:left;margin-right:10px;border:1px solid #B3B3AE;width:70px;line-height:30px;text-align:center;border-bottom:none;cursor:pointer;}
? ? ? ?#ul1 li.on{border-top:2px solid #8B4513;border-bottom:2px solid #fff;}
? ? ? ?#all div{clear:both;border:1px solid #7295B8;height:100px;border-top:0;}
? ? ? ?#all div li{padding:5px 0 0 10px;}
? ? ? ?.hide{display:none;}
? ? </style>
? ? <script type="text/javascript">
? ? // JS實現(xiàn)選項卡切換
? ? ? ? window.onload=function(){
? ? ? ? ? ? var a=document.getElementById("all");
? ? ? ? ? ? var b=a.getElementById('ul1');
? ? ? ? ? ? var c=b.getElementsByTagName('li');
? ? ? ? ? ? var d=a.getElementsByTagName('div');
? ? ? ? ? ??
? ? ? ? ? ? for(var i=0;len=c.length;i<len;i++){
? ? ? ? ? ? ? ? c[i].index=i;
? ? ? ? ? ? ? ? c[i].onmouseover=function(){
? ? ? ? ? ? ? ? ? ? for(var n=0;n<len;n++){
? ? ? ? ? ? ? ? ? ? ? ? c[n].className='';
? ? ? ? ? ? ? ? ? ? ? ? d[n].className='hide';
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? this.className='on';
? ? ? ? ? ? ? ? d[this.index].className='';
? ? ? ? ? ? ? ? }
? ? ? ? ? ? };?
? ? ? ? }
? ? </script>?
</head>
<body>
<!-- HTML頁面布局 -->
? ? <div id='all'>
? ? ? ? <ul id='ul1'>
? ? ? ? ? ? <li>房產(chǎn)</li>
? ? ? ? ? ? <li>家居</li>
? ? ? ? ? ? <li>二手房</li>
? ? ? ? </ul>
? ? ? ? <div>
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? </ul>
? ? ? ? </div>
? ? ? ? <div>
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? </ul>
? ? ? ? </div>
? ? ? ? <div>
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? ? ? <li><a href=''>275萬購昌平鄰鐵三居 總價20萬買一居</a></li>
? ? ? ? ? ? </ul>
? ? ? ? </div>
? ? </div>
</body>
</html>