万能选项卡，tab选项卡

//万能选项卡
function PaPtabs(thisObj, num) {
  if (thisObj.className == "active") return; 
  var tabObj = thisObj.parentNode.id; 
  var tabList = document.getElementById(tabObj).getElementsByTagName("li");

  for (i = 0; i < tabList.length; i++) {
    if (i == num) {
      thisObj.className = "active";
      document.getElementById(tabObj + "C" + i).style.display = "block";
    }
    else {
      tabList[i].className = "pnormal";
      document.getElementById(tabObj + "C" + i).style.display = "none";
    }
  }
};

 

前端代码：

 

<div class="Hotitle MT15">
        <h4>肿瘤热门</h4>
        <ul id="N3">
            <li class="active" onclick="PaPtabs(this,0);">1111</li>
            <li onclick="PaPtabs(this,1);">22222</li>
        </ul>
    </div>
    <div class="Rask ImgWod" id="N3C0">
      aaaa
    </div>
    <div class="Rask ImgWod none" id="N3C1">
      bbbb
    </div>