快捷導(dǎo)航

js tab 選項(xiàng)卡

更新時(shí)間：2009年04月26日 14:16:40 作者：

選項(xiàng)卡的實(shí)現(xiàn)方法比較多，但原理基本上都差不多，隱藏與顯示輪換

一般需要事先寫(xiě)好css樣式等
function tab(sId) {
var tabs = document.getElementsByTagName("H2");
var boxs = document.getElementsByTagName("h3");
if ( boxs[sId].style.display=="block"){
boxs[sId].style.display="none";
tabs[sId].style.backgroundColor="#E3F4FE";
tabs[sId].style.color="#000000";
}
else{
boxs[sId].style.display="block";
tabs[sId].style.backgroundColor="#3575CC";
tabs[sId].style.color="#ffffff";
}
for (var i=0; i<tabs.length; i++) {
if ( i != sId) {
boxs[i].style.display = "none";
tabs[i].style.backgroundColor="#E3F4FE";
tabs[i].style.color="#000000";
}
}
}

<h2 onclick="tab();">中英合作自考</h2>
<h3>
<ul>
<li></li>
</ul>
</h3>
</h2>

您可能感興趣的文章:

相關(guān)文章

js獲取dom的高度和寬度(可見(jiàn)區(qū)域及部分等等)
網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)捇蚋摺⒕W(wǎng)頁(yè)正文全文寬或高以及網(wǎng)頁(yè)正文部分左或右，詳細(xì)請(qǐng)看下文，希望對(duì)大家有所幫助
2013-06-06
intro.js 頁(yè)面引導(dǎo)簡(jiǎn)單用法分享
這篇文章介紹了intro.js 頁(yè)面引導(dǎo)簡(jiǎn)單用法，有需要的朋友可以參考一下
2013-08-08
js給selected添加options的方法
這篇文章主要介紹了js給selected添加options的方法,涉及javascript動(dòng)態(tài)添加頁(yè)面下拉列表selected的技巧,需要的朋友可以參考下
2015-05-05
uniapp引入axios異步框架的完整步驟
雖然Uniapp可以使用Vue.js自帶的$http,但也可以使用Axios,只需要在項(xiàng)目中進(jìn)行簡(jiǎn)單的配置,這篇文章主要給大家介紹了關(guān)于uniapp引入axios異步框架的相關(guān)資料,需要的朋友可以參考下
2023-12-12
js關(guān)于getImageData跨域問(wèn)題的解決方法
這篇文章主要為大家詳細(xì)介紹了js關(guān)于getImageData跨域問(wèn)題的解決方法,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
JavaScript編寫(xiě)的網(wǎng)頁(yè)小游戲，很給力
這篇文章主要介紹了JavaScript編寫(xiě)的網(wǎng)頁(yè)小游戲，附上全部代碼供大家查看，實(shí)現(xiàn)了網(wǎng)頁(yè)的小游戲頁(yè)面，需要的朋友可以參考下
2017-08-08
JS+CSS實(shí)現(xiàn)仿雅虎另類滑動(dòng)門(mén)切換效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)仿雅虎另類滑動(dòng)門(mén)切換效果,涉及JavaScript響應(yīng)鼠標(biāo)事件及針對(duì)頁(yè)面元素的嵌套循環(huán)遍歷技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-10-10
thinkjs之頁(yè)面跳轉(zhuǎn)同步異步操作
這篇文章主要介紹了thinkjs之頁(yè)面跳轉(zhuǎn)同步異步操作,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-02-02
關(guān)于對(duì)async?await效率問(wèn)題的深入思考
這篇文章主要給大家介紹了關(guān)于對(duì)async?await效率問(wèn)題的深入思考,async和await要搭配Promise使用,它進(jìn)一步極大的改進(jìn)了Promise的寫(xiě)法,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-01-01
JavaScript一元正號(hào)運(yùn)算符示例代碼
這篇文章主要給大家介紹了關(guān)于JavaScript一元正號(hào)運(yùn)算符的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-06-06