<!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta charset="utf-8"> <title>TAB切换</title> <script src="12.js"></script> <link type="text/css" rel="stylesheet" href="12.css"> <script language="javascript"> function selectTag(showContent,selfObj){ // 标签6a8a.com var tag = document.getElementById("tags").getElementsByTagName("li"); var taglength = tag.length; for(i=0; i<taglength; i++){ tag[i].className = ""; } selfObj.parentNode.className = "current"; // 标签内容 for(i=0; j=document.getElementById("tagContent"+i); i++){ j.style.display = "none"; } document.getElementById(showContent).style.display = "block"; } window.onload={ } </script> <!-- <script language="javascript"> } function selectTag(showContent,selfObj){ // 标签6a8a.com var tag = document.getElementById("tags").getElementsByTagName("li"); var taglength = tag.length; for(i=0; i<taglength; i++){ tag[i].className = ""; } selfObj.parentNode.className = "current"; // 标签内容 for(i=0; j=document.getElementById("tagContent"+i); i++){ j.style.display = "none"; } document.getElementById(showContent).style.display = "block"; } </script> --> </head> <body> <!-- 代码开始 --> <div class="content"> <ul class="ss" id="tags"> <li class="current"><a A onClick="selectTag(‘tagContent0‘,this)" href="javascript:void(0)">公司新闻</a></li> <li ><a onClick="selectTag(‘tagContent1‘,this)" href="javascript:void(0)">行业新闻</a></li> </ul> <div id="tagContent"> <div class="one tagContent" id="tagContent0"> 内容1 </div> <div class="tagContent" id="tagContent1"> 内容2 </div> <!-- 代码结束 --> </body> </html>
*{ margin:0px; padding:0px;list-style:none; font-size:14px; text-decoration:none;} .content{ width:443px; margin:auto; } .ss{ border-bottom: solid 1px #d3d3d3; height:25px; width:443px;} .ss li{ float: left; width:101px; height:25px; line-height:25px; text-align:center; } .ss li a{font-weight:bold; color:#000; display:block; } .ss li a:hover{ text-decoration:none} .ss .current{ background:#ccc;} .ss .current a{color:#fff;} .tagContent{ display:none} .one { display:block}
时间: 2024-12-12 13:55:34