寫了大半天，中間碰到幾個問題，好在最后搞出來了，曬一曬
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實踐題 - 選項卡</title>
<style type="text/css">
? ? ?/* CSS樣式制作 */ ?
? ? ? body{font-size:100%;font-family:"Microsoft Yahei";}
? ? ? body>div{margin:10px;padding:16px;height:190px;width:340px;}
? ? ? .top{margin:0;padding:0;height:20%;}
? ? ? .content{margin:0;padding:5px;height:65%;border:1px solid #069;border-top:2px solid #630; }?
? ? ? .top>div{height:36px; line-height:38px; width:70px;margin:0 5px;text-align:center;border:1px #CCC solid;border-bottom:none; float:left;}
? ? ? .content>div.off{display:none}
?.top>div.on{border-top:2px solid #630;border-bottom:2px solid #fff;} ? ? ? ? ??
</style>
<script type="text/javascript">
? ? ? ? ?
? ? // JS實現選項卡切換
? ? window.onload=function(){
? ? ? ? var div=document.getElementsByClassName('top')[0];
var menu=div.getElementsByTagName('div');
var content=document.getElementsByClassName('content')[0];
var txt=content.getElementsByTagName('div');
function click(x)
{
menu[x].onclick=function(){
for(var i=0;i<txt.length;i++)
{
txt[i].className='off';
? ?menu[i].className='';
}
txt[x].className='';
menu[x].className='on'}
}
? ? for(var i=0;i<menu.length;i++)
{ click(i); ?} ?
}
? ??
</script> ? ?
</head>
<body>
<!-- HTML頁面布局 -->
<div>
? ? <div class="top">
? ? ? ? <div class="on">房產</div>
? ? ? ? <div>家居</div>
? ? ? ? <div>二手房</div>?
? ? </div>
? ? <div class="content">
? ? ? ? <div >275萬購昌平鄰鐵三居 總價20萬買一居<br/>200萬內購五環三居 140萬安家東三環<br/>北京首現零首付樓盤 53萬購東5環50平<br/>京樓盤直降5000 中信府 公園樓王現房</div>
? ? ? ? <div class="off">40平出租屋大改造 美少女的混搭小窩<br/>經典清新簡歐愛家 90平老房煥發新生<br/>新中式的酷色溫情 66平撞色活潑家居<br/>瓷磚就像選好老婆 衛生間煙道的設計</div>
? ? ? ? <div class="off">通州豪華3居260萬 二環稀缺2居250w甩<br/>西3環通透2居290萬 130萬2居限量搶購<br/>黃城根小學學區僅260萬 121平70萬拋!<br/>獨家別墅280萬 蘇州橋2居優惠價248萬</div>
? ? </div>
</div>
</body>
</html>
2019-01-21
大佬，幫幫忙，看一下我的那個問題