當(dāng)前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
html多级折叠菜单表单,JS实战篇之收缩菜单表单布局
生活随笔
收集整理的這篇文章主要介紹了
html多级折叠菜单表单,JS实战篇之收缩菜单表单布局
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
獲取節(jié)點(diǎn)的兩種方式：
1、通過event對(duì)象的srcElement屬性；
2、通過事件源對(duì)象用this傳入。
代碼如下：
收縮菜單 · 表單布局function list(dtNode){
// var dtNode = event.srcElement;
var dlNode = dtNode.parentNode;
// alert(dtNode.nodeName+"---"+dlNode.nodeName);
var dlNodes = document.getElementsByTagName("dl");
// alert(dlNodes.length);
for(var i=0; i
if(dlNodes[i] == dlNode){
/*判斷當(dāng)前標(biāo)題是展開還是關(guān)閉狀態(tài)，默認(rèn)關(guān)閉，先執(zhí)行else語句*/
if(dlNode.className == "open"){
dlNode.className = "close";
}
else{
dlNode.className = "open";
}
}
else{
dlNodes[i].className = "close";
}
}
}
dl{
overflow: hidden;
height: 18px;
}
.open{
overflow: visible;
}
.close{
overflow: hidden;
}
今天天氣好晴朗創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)
總結(jié)
以上是生活随笔為你收集整理的html多级折叠菜单表单,JS实战篇之收缩菜单表单布局的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： python renamer模块_art
- 下一篇： 打docker镜像_从安全到镜像流水线，