javascript+dom树型菜单类,希望朋友们一起进步


Posted in Javascript onMay 03, 2007

树菜单js网上多得是,自己写了一个树菜单类,自认为还不错,公开大家共享和探讨,和大家一起进步最快乐!!
/*  KuoMart.com__MyKuoMart , Create By ybcola(at)163.com , 2006-7-2
   Last Modified 2006-7-2 , ybcola@163.com */
<!--
function Dtree(){
this.MenuGroupClose="images/treeview_close.gif"; //菜单关闭图标
this.MenuGroupOpen="images/treeview_open.gif"; //菜单打开图标
this.MenuItemClass=""; //菜单项样式
this.MenuItemInfoClass=""; //菜单链接样式
this.MenuItemlPad="12px";//下级菜单缩进仁值
this.DefaultGroupState=false; //菜单组装入时默认状态
document.write("<div id=\"treeroot\"></div>");
this.Node=document.getElementById("treeroot");
//0结点DOM对像,数组1为连接显示,2为连接href,3为连接target,4为连接显示前图标
this.AddItem=function(menuinfo){
var div=creatediv();
  var div1=creatediv();
var ico=[this.MenuGroupClose,this.MenuGroupOpen];
div.className=this.MenuItemClass;
div1.style.marginLeft=this.MenuItemlPad;
div1.style.display=this.DefaultGroupState?"":"none";
var Node=menuinfo[0]?menuinfo[0][1]:this.Node;
var iteminfo="";
if(menuinfo[4]) iteminfo="<img src=\""+menuinfo[4]+"\" align=\"absmiddle\">";
if(menuinfo[2]) iteminfo+=" <a href=\""+menuinfo[2]+"\" target=\""+menuinfo[3]+"\" class=\""+this.MenuItemInfoClass+"\">";
iteminfo+=menuinfo[1];
if(menuinfo[2])iteminfo+="</a>";
div.innerHTML=iteminfo;
Node.appendChild(div);
Node.appendChild(div1);
if(menuinfo[0]){
if(!menuinfo[0][0].havechild) {
var as=document.createElement("img");
as.src=ico[1];
as.align="absmiddle";
as.onclick=function(){
 swapshow(Node,as,ico);
}
menuinfo[0][0].insertBefore(as,menuinfo[0][0].firstChild);
as.insertAdjacentText("afterEnd"," ");
menuinfo[0][0].havechild=true;
}
}
return [div,div1];
}

function creatediv(){
var div=document.createElement("div");
return div;
}

function swapshow(obj,ico,oo){
if(obj.style.display!=""){
obj.style.display="";
ico.src=oo[0];

else{
obj.style.display="none";
ico.src=oo[1];
}
}
}
-->  

Javascript 相关文章推荐
jquery DOM操作 基于命令改变页面
May 06 Javascript
Javascript处理DOM元素事件实现代码
May 23 Javascript
javascript实现的网站访问量统计代码
Dec 20 Javascript
JavaScript与jQuery实现的闪烁输入效果
Feb 18 Javascript
JavaScript中Number对象的toFixed() 方法详解
Sep 02 Javascript
form表单转Json提交的方法(推荐)
Sep 23 Javascript
关于vue.js过渡css类名的理解(推荐)
Apr 10 Javascript
老生常谈Bootstrap媒体对象
Jul 06 Javascript
详解Node全局变量global模块
Sep 28 Javascript
vue源码入口文件分析(推荐)
Jan 30 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
May 27 Javascript
bootstrap table列和表头对不齐的解决方法
Jul 19 Javascript
几行代码轻松搞定jquery实现flash8类似的连接效果
May 03 #Javascript
JS实多级联动下拉菜单类,简单实现省市区联动菜单!
May 03 #Javascript
javascript静态的url如何传递
May 03 #Javascript
可以支持多中格式的JS键盘
May 02 #Javascript
javascript英文日期(有时间)选择器
May 02 #Javascript
(推荐一个超好的JS函数库)S.Sams Lifexperience ScriptClassLib
Apr 29 #Javascript
JavaScript 实现??打印?理
Apr 28 #Javascript
You might like
php数据入库前清理 注意php intval与mysql的int取值范围不同
2010/12/12 PHP
PHP连接MSSQL方法汇总
2016/02/05 PHP
php添加数据到xml文件的简单例子
2016/09/08 PHP
php5.3后静态绑定用法详解
2016/11/11 PHP
php微信开发之谷歌测距
2018/06/14 PHP
2014最热门的JavaScript代码高亮插件推荐
2014/11/25 Javascript
生成二维码方法汇总
2014/12/26 Javascript
封装好的js判断操作系统与浏览器代码分享
2015/01/09 Javascript
flash+jQuery实现可关闭及重复播放的压顶广告
2015/04/15 Javascript
js实现网页收藏功能
2015/12/17 Javascript
打造自己的jQuery插件入门教程
2016/09/23 Javascript
超全面的JavaScript开发规范(推荐)
2017/01/21 Javascript
Vue.js在使用中的一些注意知识点
2017/04/29 Javascript
vue监听scroll的坑的解决方法
2017/09/07 Javascript
vue-cli创建的项目,配置多页面的实现方法
2018/03/15 Javascript
axios post提交formdata的实例
2018/03/16 Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
2018/06/02 Javascript
vue项目中跳转到外部链接的实例讲解
2018/09/20 Javascript
vue-router启用history模式下的开发及非根目录部署方法
2018/12/23 Javascript
vue基于better-scroll实现左右联动滑动页面
2020/06/30 Javascript
node.js文件的复制、创建文件夹等相关操作
2021/02/05 Javascript
Python脚本暴力破解栅栏密码
2015/10/19 Python
Python爬虫爬取新浪微博内容示例【基于代理IP】
2018/08/03 Python
用pycharm开发django项目示例代码
2018/10/24 Python
python实践项目之监控当前联网状态详情
2019/05/23 Python
Python Selenium安装及环境配置的实现
2020/03/17 Python
Python Process创建进程的2种方法详解
2021/01/25 Python
对CSS3选择器的研究(详解)
2016/09/16 HTML / CSS
您的网上新华书店:文轩网
2016/08/24 全球购物
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
幼儿园家长会欢迎词
2014/01/09 职场文书
村委会贫困证明范本
2014/09/17 职场文书
幼儿园教研工作总结2015
2015/05/12 职场文书
付款证明格式范文
2015/06/19 职场文书
如何用Python搭建gRPC服务
2021/06/30 Python
详解nginx location指令
2022/01/18 Servers