首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

tab 的容易实现原理

2012-08-25 
tab 的简单实现原理你可以将div中的内容设置为table 或者内嵌入其它div ?!DOCTYPE HTML PUBLIC -//W3C

tab 的简单实现原理

你可以将div中的内容设置为table 或者内嵌入其它div ==

?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
?<HEAD>
? <TITLE> New Document </TITLE>
?</HEAD>
?<BODY>
?<input type="button" value="div1" id="tab1" onclick="changeDiv(this)" />
?<input type="button" value="div2" id="tab2" onclick="changeDiv(this)" />
?<table>
??<tr>
???<td>
????<div id="div_tab1" style="border: 1px solid #0099CC;">
?????</br>
?????tab1 is chosed
?????</br>
????</div>
????<div id="div_tab2" style="display:none;border: 1px solid #0099CC;">
?????</br>
?????tab2 is chosed
?????</br>
????</div>
???</td>
??</tr>
?</table>


?</BODY>
?<script language="javascript">
?function changeDiv(obj){
?//?alert(obj.id);
??div_tab1.style.display="none";
??div_tab2.style.display="none";
??var tid = document.getElementById('div_'+obj.id);
?//?alert(tid);
??tid.style.display="";
??
?}
?</script>
</HTML>

热点排行