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

 更新时间:2007年05月03日 00:00:00   作者:  
树菜单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实现验证身份证号的有效性并提示

    下面分享的JS脚本是我用过的最完善的身份证号的验证程序了,因为只有真正的身份证号才能被通过,小伙伴们可以试试。直接复制运行。
    2015-04-04
  • 微信小程序实现简单聊天室

    微信小程序实现简单聊天室

    这篇文章主要为大家详细介绍了微信小程序实现简单聊天室,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-07-07
  • 新手快速入门JavaScript装饰者模式与AOP

    新手快速入门JavaScript装饰者模式与AOP

    这篇文章主要介绍了新手快速入门JavaScript装饰者模式与AOP,在不改变对象)的情况下动态的为其添加功能,这就是装饰者模式,下面小编带大家来深入学习一下吧
    2019-06-06
  • javaScript中Math()函数注意事项

    javaScript中Math()函数注意事项

    本文主要给大家分享了javascript中Math()函数的注意事项,以及math对象的方法,十分的简单实用,有需要的小伙伴可以参考下
    2015-06-06
  • 用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)

    用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)

    Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定
    2012-06-06
  • JavaScript性能优化技术深入研究

    JavaScript性能优化技术深入研究

    这篇文章主要介绍了JavaScript性能优化技术,优化涉及多个方面,包括代码执行效率、内存使用、DOM操作、网络请求等,通过合理的优化策略,可以显著提升应用的响应速度和用户体验,掌握这些技术对于构建高性能的JavaScript应用至关重要,需要的朋友可以参考下
    2025-02-02
  • TypeScript 装饰器定义

    TypeScript 装饰器定义

    这篇文章主要介绍了TypeScript 装饰器定义,装饰器是一种新的声明,它可以作用于类声明 、方法 、访问器 、属性以及参数上,下面我们就来看看TypeScript 装饰器的具体定义吧,需要的朋友可以参考一下,希望对你有所帮助
    2021-12-12
  • 读Javascript高性能编程重点笔记

    读Javascript高性能编程重点笔记

    这篇文章主要介绍了读Javascript高性能编程重点笔记,需要的朋友可以参考下
    2016-12-12
  • JS实现json对象数组按对象属性排序操作示例

    JS实现json对象数组按对象属性排序操作示例

    这篇文章主要介绍了JS实现json对象数组按对象属性排序操作,涉及javascript使用sort方法针对json数组的遍历与排序相关操作实现技巧,需要的朋友可以参考下
    2018-05-05
  • js实例属性和原型属性示例详解

    js实例属性和原型属性示例详解

    本文通过实例向大家讲述了js实例属性和原型属性,详情请看注释,看不懂的话,请放弃javascript吧。
    2014-11-11

最新评论