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 相关文章推荐
JavaScript Event学习第四章 传统的事件注册模型
Feb 07 Javascript
DOM Scripting中的图片切换[兼容Firefox]
Jun 12 Javascript
jQuery验证Checkbox是否选中的代码 推荐
Sep 04 Javascript
Javascript call和apply区别及使用方法
Nov 14 Javascript
js传中文参数controller里获取参数乱码问题解决方法
Jan 03 Javascript
JS 弹出层 定位至屏幕居中示例
May 21 Javascript
实现placeholder效果的方案汇总
Jun 11 Javascript
JS简单编号生成器实现方法(附demo源码下载)
Apr 05 Javascript
jQuery mobile的header和footer在点击屏幕的时候消失的解决办法
Jul 01 Javascript
JS Select下拉框(支持输入模糊查询)
Feb 04 Javascript
BootStrap导航栏问题记录
Jul 31 Javascript
vuex vue简单使用知识点总结
Aug 29 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
建立动态的WML站点(二)
2006/10/09 PHP
完美解决PHP中文乱码
2009/11/26 PHP
PHP实现对xml进行简单的增删改查(CRUD)操作示例
2017/05/19 PHP
PHP+RabbitMQ实现消息队列的完整代码
2019/03/20 PHP
PHP实现限制域名访问的实现代码(本地验证)
2020/09/13 PHP
探讨JQUERY JSON的反序列化类 using问题的解决方法
2013/12/19 Javascript
单击某一段文字改写文本颜色
2014/06/06 Javascript
JS实现可缩放、拖动、关闭和最小化的浮动窗口完整实例
2015/03/04 Javascript
浅谈Jquery为元素绑定事件
2015/04/27 Javascript
深入理解jquery中extend的实现
2016/12/22 Javascript
详解jQuery中关于Ajax的几个常用的函数
2017/07/17 jQuery
快速掌握jquery分页插件jqPaginator的使用方法
2017/08/09 jQuery
基于vue-cli 打包时抽离项目相关配置文件详解
2018/03/07 Javascript
JavaScript常用数学函数用法示例
2018/05/14 Javascript
JS实现面向对象继承的5种方式分析
2018/07/21 Javascript
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
2019/04/18 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
2019/09/20 Javascript
python中global与nonlocal比较
2014/11/21 Python
Python使用random和tertools模块解一些经典概率问题
2015/01/28 Python
Python的Flask框架中配置多个子域名的方法讲解
2016/06/07 Python
django 发送手机验证码的示例代码
2018/04/25 Python
解决Python print输出不换行没空格的问题
2018/11/14 Python
解决PySide+Python子线程更新UI线程的问题
2019/01/11 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
安装2019Pycharm最新版本的教程详解
2019/10/22 Python
基于python实现百度语音识别和图灵对话
2020/11/02 Python
英国票务网站:Ticketmaster英国
2018/08/27 全球购物
美体小铺印度官网:The Body Shop印度
2019/10/17 全球购物
Diesel美国网上商店:意大利牛仔时装品牌
2020/12/10 全球购物
幼儿园儿童节主持词
2014/03/21 职场文书
企业文明单位申报材料
2014/05/16 职场文书
委托书怎样写
2014/08/30 职场文书
七年级话题作文之执着
2019/11/19 职场文书
Python基础之变量的相关知识总结
2021/06/23 Python
利用JavaScript写一个简单计算器
2021/11/27 Javascript
Ruby处理CSV数据方法详解
2022/04/18 Ruby