<div class="forestcamp_box">
<img src="img/home_02.jpg" />
<div class="subtitle" id="button">
<p>通知公告</p>
<p>政策解读</p>
<div>查看更多 >></div>
</div>
<div id="text" class="main_matter">
<div class="main_matter">
<p>黔西南高速交警大队“四个狠抓” 强化道路交通事故预防工作</p>
<p>扩大共识，精诚合作——中俄运输合作分委会第22次会议在俄......</p>
<p>何建中在湖北调研时指出：进一步做好总体谋划完善标准规范......</p>
<p>【评论】平台公司应当将“自责”落实到行动上</p>
<p>【见证40年·我们的奋斗故事】“内河船不跨省” 到江海联运通全球</p>
<p>云南首个高速公路债券项目上市募资</p>
<p>《2017年全国收费公路统计公报》解读</p>
<p>交通运输部关于《通航建筑物运行管理办法（征求意见稿）》公开......</p>
</div>
<div class="main_matter">
<p>【见证40年·我们的奋斗故事】“内河船不跨省” 到江海联运通全球</p>
<p>云南首个高速公路债券项目上市募资</p>
<p>《2017年全国收费公路统计公报》解读</p>
<p>交通运输部关于《通航建筑物运行管理办法（征求意见稿）》公开......</p>
</div>
</div>
</div>
没有把贴入，看贴图吧
封装好的选项卡进行调用
change({
btnsId:"button",//传入按钮父级id
contsId:"text",//传入块元素父级id
btnsClassNormal:"title_noraml",// 传入按钮未点击样式
btnsClassSpecial:"title_specil"//传入按钮点击后样式
});
对选项卡进行封装
function change(cha){
var btns = document.getelementById(cha.btnsId).children;//获取你要进行点击的按钮
var conts = document.getelementById(cha.contsId).children;//获取你要对应操作的块
for (var i=0;i<btns.length;i++) {
btns[i].index = i; //设置一个index属性使按钮和块进行对应
btns[i].onclick=function(){
for (var j=0;j<conts.length;j++) {//清空
btns[j].className = cha.btnsClassNormal;
conts[j].style.display = "none";
}
this.className = cha.btnsClassSpecial;//点击的进行样式添加
conts[this.index].style.display = "block";//对应块显示出来
}
}
}