用JS實(shí)現(xiàn)一個TreeMenu效果分享
更新時間：2011年08月28日 18:53:54 作者：
用JS實(shí)現(xiàn)一個TreeMenu效果分享，思路比較簡單，但很實(shí)用
今天學(xué)的一點(diǎn)小東西和大家分享一下。
類似TreeMenu控件.
不廢話直接代碼：
<script language="javascript">
function control() {//定義函數(shù)
if (sMenus3.innerHTML == "+") {//判斷展開狀態(tài)
ulMenu3.style.display = "block";//如果是“+”號 則可以展開
sMenus3.innerText = "-";//展開之后顯示為減號
}
else {
ulMenu3.style.display = "none";//如果為“-”號 則不能展開
sMenus3.innerText = "+";//點(diǎn)擊之后符號變換。
}
}
</script>
Html 代碼：
//這段代碼沒什么說的 主要就是Id 和js代碼中的Id對應(yīng)。
<body>
<span id="sMenus3" style=" border:1px solid #00000; color:Blue;cursor:hand ;" onclick="control()">-</span>無網(wǎng)站狀態(tài)<br/>
<ul id="ulMenu3">
<li><a target="_blank">百度</a> </li>
<li><a target="_parent">百度</a></li>
<li><a target="_blank">還是百度</a></li>
</ul>
</body>
類似TreeMenu控件.
不廢話直接代碼：
復(fù)制代碼 代碼如下:
<script language="javascript">
function control() {//定義函數(shù)
if (sMenus3.innerHTML == "+") {//判斷展開狀態(tài)
ulMenu3.style.display = "block";//如果是“+”號 則可以展開
sMenus3.innerText = "-";//展開之后顯示為減號
}
else {
ulMenu3.style.display = "none";//如果為“-”號 則不能展開
sMenus3.innerText = "+";//點(diǎn)擊之后符號變換。
}
}
</script>
Html 代碼：
//這段代碼沒什么說的 主要就是Id 和js代碼中的Id對應(yīng)。
復(fù)制代碼 代碼如下:
<body>
<span id="sMenus3" style=" border:1px solid #00000; color:Blue;cursor:hand ;" onclick="control()">-</span>無網(wǎng)站狀態(tài)<br/>
<ul id="ulMenu3">
<li><a target="_blank">百度</a> </li>
<li><a target="_parent">百度</a></li>
<li><a target="_blank">還是百度</a></li>
</ul>
</body>
相關(guān)文章
在元素間的文本就是通過對象.innerText，下面有個不錯的示例，感興趣的朋友可以參考下2014-01-01
有時候我們需要獲取當(dāng)前網(wǎng)頁的網(wǎng)址，方便我們判斷，一般情況我們都是通過location.href來獲取2013-12-12
Javascript實(shí)例項目放大鏡特效的實(shí)現(xiàn)流程
商城網(wǎng)站包括APP端中把鼠標(biāo)光標(biāo)移動到預(yù)覽圖上就會看到這部分商品圖片放大了，這就是JavaScript實(shí)現(xiàn)的放大鏡特效，今天我們也來實(shí)現(xiàn)一波2021-11-11
JavaScript程序中實(shí)現(xiàn)繼承特性的方式總結(jié)
JavaScript是一門強(qiáng)行聲稱面向?qū)ο蟮恼Z言,而繼承是面向?qū)ο蟮囊淮笾饕匦?這里我們根據(jù)阮一峰老師的文章來看一下JavaScript程序中實(shí)現(xiàn)繼承特性的方式總結(jié)2016-06-06
這篇文章介紹了Js中的parseInt函數(shù)，有需要的朋友可以參考一下2013-07-07
javascript:void(0)的含義及用法實(shí)例
這篇文章介紹了javascript:void(0)的含義及用法實(shí)例，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-12-12
深入學(xué)習(xí)JavaScript 高階函數(shù)
這篇文章主要介紹了深入學(xué)習(xí)JavaScript 高階函數(shù)，在 JavaScript 中，函數(shù)是一種特殊類型的對象，它們是 Function objects。,需要的朋友可以參考下2019-06-06
javascript實(shí)現(xiàn)網(wǎng)頁屏蔽Backspace事件，輸入框不屏蔽
這篇文章主要介紹了如何實(shí)現(xiàn)網(wǎng)頁屏蔽Backspace事件而輸入框不屏蔽，需要的朋友可以參考下2015-07-07
鑒于有同學(xué)在學(xué)習(xí)的時候容易混肴，所以筆者還是將其加以區(qū)別,需要的朋友可以參考下2013-07-07
怎樣在JavaScript里寫一個swing把數(shù)據(jù)插入數(shù)據(jù)庫
在JavaScript里寫一個swing來實(shí)現(xiàn)確定取消，來決定是否執(zhí)行這個功能 控制把數(shù)據(jù)插入數(shù)據(jù)庫,接下來介紹實(shí)現(xiàn)方法2012-12-12