溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下JavaScript實現簡單的樹形菜單效果，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
1. 簡單，只需理解基本的概念，就可以編寫適合于各種情況的應用程序；2. 面向對象；3. 分布性，Java是面向網絡的語言；4. 魯棒性，java提供自動垃圾收集來進行內存管理，防止程序員在管理內存時容易產生的錯誤。；5. 安全性，用于網絡、分布環境下的Java必須防止病毒的入侵。6. 體系結構中立，只要安裝了Java運行時系統，就可在任意處理器上運行。7. 可移植性，Java可以方便地移植到網絡上的不同機器。8.解釋執行，Java解釋器直接對Java字節碼進行解釋執行。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>樹形菜單</title>
<style>
body {
font: 12px/20px 宋體;
}
img {
vertical-align: center;
border: none;
}
a {
text-decoration: none;
color: #000;
}
li {
list-style: none;
}
</style>
<script>
function onclickfclose(id) {
var ul = document.getElementById(id);
var objv = ul.style.display;
if (objv == 'none') {
ul.style.display = 'block'
} else {
ul.style.display = 'none';
}
}
</script>
</head>
<body>
<b><img src="images/fold.gif" alt="">樹形菜單</b>
<ul>
<a href="javascript:onclickfclose('art')"><img src="images/fclose.gif" alt="">文學藝術</a>
</ul>
<ul id="art" >
<li><img src="images/doc.gif" alt="">著名小說</li>
<li><img src="images/doc.gif" alt="">著名小說</li>
<li><img src="images/doc.gif" alt="">著名小說</li>
<li><img src="images/doc.gif" alt="">著名小說</li>
</ul>
<ul>
<a href="javascript:onclickfclose('fangc')"><img src="images/fclose.gif" alt="">房產論壇</a>
</ul>
<ul id="fangc" style="display: none;>
<li><img src=" images/doc.gif" alt="">房產推銷</li>
<li><img src="images/doc.gif" alt="">房產推銷</li>
<li><img src="images/doc.gif" alt="">房產推銷</li>
<li><img src="images/doc.gif" alt="">房產推銷</li>
</ul>
<ul>
<a href="javascript:onclickfclose('tuhua')"><img src="images/fclose.gif" alt="">提圖專區</a>
</ul>
<ul id="tuhua" style="display: none;>
<li><img src=" images
/doc.gif" alt="">風景圖畫</li>
<li><img src="images/doc.gif" alt="">風景圖畫</li>
<li><img src="images/doc.gif" alt="">風景圖畫</li>
<li><img src="images/doc.gif" alt="">風景圖畫</li>
</ul>
<ul>
<a href="javascript:onclickfclose('bagua')"><img src="images/fclose.gif" alt="">娛樂八卦</a>
</ul>
<ul id="bagua" style="display: none;>
<li><img src=" images
/doc.gif" alt="">明星采訪</li>
<li><img src="images/doc.gif" alt="">明星采訪</li>
<li><img src="images/doc.gif" alt="">明星采訪</li>
<li><img src="images/doc.gif" alt="">明星采訪</li>
</ul>
</body>
</html>以上是“JavaScript實現簡單的樹形菜單效果”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
