js 选项卡

window.onload=function(){
    toTab();
}
function getByClass(oParent,sClass)
{
    var aEle=oParent.getElementsByTagName('*');
    var aResult=[];
    for(var i=0;i<aEle.length;i++)
    {
        if(aEle[i].className==sClass)
        {
            aResult.push(aEle[i]);
        }
    }
    return aResult;
}
function toTab(){
    var oTag=document.getElementById("tags");
    var aSpan=oTag.getElementsByTagName("span");
    var oTab_con=document.getElementById("tagContent");
    var aDivCon=getByClass(oTab_con,"innerCon");

    for(var i=0;i<aSpan.length;i++){
        aSpan[i].index=i;
        aSpan[i].onclick=function(){
            for(var i=0;i<aSpan.length;i++){
                aSpan[i].className="";
                aDivCon[i].style.display="none";
            }
            aSpan[this.index].className="selectTag";
            aDivCon[this.index].style.display="block";
        }
    }
}

/*信息发布部分*/
#tags{
    border-bottom:1px solid #aecbd4;
    margin:0px auto 0px;
    width:900px;
    height:34px;
    line-height:34px;
}
#tags span{
    cursor:pointer;
    height:35px;
    display:inline-block;
    line-height:35px;
    margin-top:-1px;
    padding:0 13px;
    font-size:13px;
    float:left;
    color:#ff8400;
}
#tags span.selectTag{
    height:33px;
    line-height:29px;
    background:#fff;
    color:#122E67;
    border-top:3px solid #ff8400;
    border-left:1px solid #aecbd4;
    border-right:1px solid #aecbd4;
    padding:0 12px;
}
#tagContent{
    border:1px solid #aecbd4;
    border-top:none;
    width:898px;
    height:auto;
    background:#fff;
    overflow:hidden;
    margin:0 auto;
}
#tagContent .innerCon{
    display:none;
}

  <div id="tags">
                <span class="selectTag">家庭作业管理</span>
                <span>家庭作业发布</span>
            </div>

            <div id="tagContent">
                <div class="innerCon" style="display: block;" >
                   
                </div>

                <div class="innerCon">
                   
                </div>