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 相关文章推荐
use jscript with List Proxy Server Information
Jun 11 Javascript
TopList标签和JavaScript结合两例
Aug 12 Javascript
Extjs学习笔记之九 数据模型(上)
Jan 11 Javascript
jQuery插件之jQuery.Form.js用法实例分析(附demo示例源码)
Jan 04 Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
Jul 21 Javascript
利用Js+Css实现折纸动态导航效果实例源码
Jan 25 Javascript
详解Angular2响应式表单
Jun 14 Javascript
jQuery自动或手动图片切换效果
Oct 11 jQuery
基于vue-upload-component封装一个图片上传组件的示例
Oct 16 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
es6中new.target的作用和使用场景简单示例分析
Mar 14 Javascript
9个JavaScript日常开发小技巧
Oct 06 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
Discuz! 5.0.0论坛程序中加入一段js代码,让会员点击下载附件前自动弹出提示窗口
2007/04/18 PHP
Yii调试SQL的常用方法
2014/07/09 PHP
php+mysqli数据库连接的两种方式
2015/01/28 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
基于Jquery的跨域传输数据(JSONP)
2011/03/10 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
2011/03/28 Javascript
js制作的鼠标悬浮时产生的下拉框效果
2012/10/27 Javascript
JS声明变量背后的编译原理剖析
2012/12/28 Javascript
node.js中的path.delimiter方法使用说明
2014/12/09 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
2015/03/10 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
JavaScript对象数组排序函数及六个用法
2015/12/23 Javascript
快速获取/设置iframe内对象元素的几种js实现方法
2016/05/20 Javascript
深入解析JavaScript中的立即执行函数
2016/05/21 Javascript
JavaScript实现分页效果
2017/03/28 Javascript
详解angularjs获取元素以及angular.element()用法
2017/07/25 Javascript
jQuery实现新闻播报滚动及淡入淡出效果示例
2018/03/23 jQuery
Node中对非阻塞I/O、事件循环的知识点总结
2020/01/05 Javascript
vue单文件组件无法获取$refs的问题
2020/06/24 Javascript
vue-cli或vue项目利用HBuilder打包成移动端app操作
2020/07/29 Javascript
Python创建文件和追加文件内容实例
2014/10/21 Python
python实现备份目录的方法
2015/08/03 Python
Python3编程实现获取阿里云ECS实例及监控的方法
2017/08/18 Python
初探TensorFLow从文件读取图片的四种方式
2018/02/06 Python
Ubuntu下使用python读取doc和docx文档的内容方法
2018/05/08 Python
Pytorch抽取网络层的Feature Map(Vgg)实例
2019/08/20 Python
如何用tempfile库创建python进程中的临时文件
2021/01/28 Python
美国LOGO设计公司:The Logo Company
2018/07/16 全球购物
联想西班牙官网:Lenovo西班牙
2018/08/28 全球购物
高校辅导员推荐信范文
2013/12/25 职场文书
经济管理专业求职信
2014/06/09 职场文书
增员口号大全
2014/06/18 职场文书
农业局党的群众路线教育实践活动整改方案
2014/09/20 职场文书
2015仓库保管员年终工作总结
2015/05/13 职场文书
五星级酒店宣传口号
2015/12/25 职场文书
Laravel中获取IP的真实地理位置
2021/04/01 PHP