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 相关文章推荐
JS获取父节点方法
Aug 20 Javascript
javascript 用记忆函数快速计算递归函数
Mar 15 Javascript
jQuery JSON的解析方式分享
Apr 05 Javascript
JavaScript中的几个关键概念的理解-原型链的构建
May 12 Javascript
JS获取URL中的参数数据
Dec 05 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
Oct 17 Javascript
给before和after伪元素设置js效果的方法
Dec 04 Javascript
关于RequireJS的简单介绍即使用方法
Oct 20 Javascript
vue项目中做编辑功能传递数据时遇到问题的解决方法
Dec 19 Javascript
利用JS响应式修改vue实现页面的input值
Sep 02 Javascript
JS设置自定义快捷键并实现图片上下左右移动
Oct 17 Javascript
Vue.js自定义指令学习使用详解
Oct 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
基于qmail的完整WEBMAIL解决方案安装详解
2006/10/09 PHP
mysql 查询指定日期时间内sql语句实现原理与代码
2012/12/16 PHP
解析php函数method_exists()与is_callable()的区别
2013/06/21 PHP
php解析base64数据生成图片的方法
2016/12/06 PHP
PHP实践教程之过滤、验证、转义与密码详解
2017/07/24 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
设为首页加入收藏兼容360/火狐/谷歌/IE等主流浏览器的代码
2013/03/26 Javascript
原生JS可拖动弹窗效果实例代码
2013/11/09 Javascript
jquery实现非叠加式的搜索框提示效果
2014/01/07 Javascript
JS简单操作select和dropdownlist实例
2014/11/26 Javascript
AngularJS的内置过滤器详解
2015/05/14 Javascript
JavaScript实现列表分页功能特效
2015/05/15 Javascript
基于Jquery实现表单验证
2020/07/20 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
2016/10/28 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(同步显示图像位置信息)
2016/12/02 Javascript
详解基于webpack和vue.js搭建开发环境
2017/04/05 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】
2017/12/12 Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
2018/01/22 Javascript
jQuery实现每日秒杀商品倒计时功能
2019/09/06 jQuery
webpack 如何同时输出压缩和未压缩的文件的实现步骤
2020/06/05 Javascript
Python基于smtplib实现异步发送邮件服务
2015/05/28 Python
Python的Flask框架中的Jinja2模板引擎学习教程
2016/06/30 Python
Linux下为不同版本python安装第三方库
2016/08/31 Python
python爬虫之urllib3的使用示例
2018/07/09 Python
python绘制中国大陆人口热力图
2018/11/07 Python
python-itchat 统计微信群、好友数量,及原始消息数据的实例
2019/02/21 Python
Python中PyQt5/PySide2的按钮控件使用实例
2019/08/17 Python
解析python实现Lasso回归
2019/09/11 Python
python 将视频 通过视频帧转换成时间实例
2020/04/23 Python
Python getsizeof()和getsize()区分详解
2020/11/20 Python
英国领先的葡萄酒专家:Majestic Wine
2017/05/30 全球购物
李开复演讲稿
2014/05/24 职场文书
班级课外活动总结
2014/07/09 职场文书
中韩经贸翻译专业大学生职业生涯规划范文
2014/09/18 职场文书
迎新生欢迎词2015
2015/07/16 职场文书