js 属性结构

最新推荐文章于 2025-01-11 08:29:44 发布
最新推荐文章于 2025-01-11 08:29:44 发布
阅读量1k 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： function javascript border methods constructor variables
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/sky_3013/article/details/2299697

首先在项目里面建一个.js文件

function Folder(folderDescription, hreference) //constructor
{
  //constant data
  this.desc = folderDescription
  this.hreference = hreference
  this.id = -1  
  this.navObj = 0 
  this.iconImg = 0 
  this.nodeImg = 0 
  this.isLastNode = 0
 
  //dynamic data
  this.isOpen = true
  this.iconSrc = "/img/ftv2folderopen.gif"  
  this.children = new Array
  this.nChildren = 0
 
  //methods
  this.initialize = initializeFolder
  this.setState = setStateFolder
  this.addChild = addChild
  this.createIndex = createEntryIndex
  this.hide = hideFolder
  this.display = display
  this.renderOb = drawFolder
  this.totalHeight = totalHeight
  this.subEntries = folderSubEntries
  this.outputLink = outputFolderLink
}
 
function setStateFolder(isOpen)
{
  var subEntries
  var totalHeight
  var fIt = 0
  var i=0
 
  if (isOpen == this.isOpen)
    return
 
  if (browserVersion == 2) 
  {
    totalHeight = 0
    for (i=0; i < this.nChildren; i++)
      totalHeight = totalHeight + this.children[i].navObj.clip.height
      subEntries = this.subEntries()
    if (this.isOpen)
      totalHeight = 0 - totalHeight
    for (fIt = this.id + subEntries + 1; fIt < nEntries; fIt++)
      indexOfEntries[fIt].navObj.moveBy(0, totalHeight)
  } 
  this.isOpen = isOpen
  propagateChangesInState(this)
}
 
function propagateChangesInState(folder)
{  
  var i=0
 
  if (folder.isOpen)
  {
    if (folder.nodeImg)
      if (folder.isLastNode)
        folder.nodeImg.src = "/img/ftv2mlastnode.gif"
      else
   folder.nodeImg.src = "/img/ftv2mnode.gif"
    folder.iconImg.src = "/img/ftv2folderopen.gif"
    for (i=0; i<folder.nChildren; i++)
      folder.children[i].display()
  }
  else
  {
    if (folder.nodeImg)
      if (folder.isLastNode)
        folder.nodeImg.src = "/img/ftv2plastnode.gif"
      else
   folder.nodeImg.src = "/img/ftv2pnode.gif"
    folder.iconImg.src = "/img/ftv2folderclosed.gif"
    for (i=0; i<folder.nChildren; i++)
      folder.children[i].hide()
  } 
}
 
function hideFolder()
{
  if (browserVersion == 1) {
    if (this.navObj.style.display == "none")
      return
    this.navObj.style.display = "none"
  } else {
    if (this.navObj.visibility == "hiden")
      return
    this.navObj.visibility = "hiden"
  }
  
  this.setState(0)
}
 
function initializeFolder(level, lastNode, leftSide)
{
var j=0
var i=0
var numberOfFolders
var numberOfDocs
var nc
     
  nc = this.nChildren
  
  this.createIndex()
 
  var auxEv = ""
 
  if (browserVersion > 0)
    auxEv = "<a href='javascript:clickOnNode("+this.id+")'>"
  else
    auxEv = "<a>"
 
  if (level>0)
    if (lastNode) //the last 'brother' in the children array
    {
      this.renderOb(leftSide + auxEv + "<img name='nodeIcon" + this.id + "' src='/img/ftv2mlastnode.gif' width=16 height=22 border=0></a>")
      leftSide = leftSide + "<img src='/img/ftv2blank.gif' width=16 height=22>" 
      this.isLastNode = 1
    }
    else
    {
      this.renderOb(leftSide + auxEv + "<img name='nodeIcon" + this.id + "' src='/img/ftv2mnode.gif' width=16 height=22 border=0></a>")
      leftSide = leftSide + "<img src='/img/ftv2vertline.gif' width=16 height=22>"
      this.isLastNode = 0
    }
  else
    this.renderOb("")
  
  if (nc > 0)
  {
    level = level + 1
    for (i=0 ; i < this.nChildren; i++) 
    {
      if (i == this.nChildren-1)
        this.children[i].initialize(level, 1, leftSide)
      else
        this.children[i].initialize(level, 0, leftSide)
      }
  }
}
 
function drawFolder(leftSide)
{
  if (browserVersion == 2) {
    if (!doc.yPos)
      doc.yPos=8
    doc.write("<layer id='folder" + this.id + "' top=" + doc.yPos + " visibility=hiden>")
  }
  
  doc.write("<table ")
  if (browserVersion == 1)
    doc.write(" id='folder" + this.id + "' style='position:block;' ")
  doc.write(" border=0 cellspacing=0 cellpadding=0>")
  doc.write("<tr><td>")
  doc.write(leftSide)
  this.outputLink()
  doc.write("<img name='folderIcon" + this.id + "' ")
  doc.write("src='" + this.iconSrc+"' border=0></a>")
  doc.write("</td><td valign=middle nowrap>")
  if (USETEXTLINKS)
  {
    this.outputLink()
    doc.write(this.desc + "</a>")
  }
  else
    doc.write(this.desc)
  doc.write("</td>") 
  doc.write("</table>")
  
  if (browserVersion == 2) {
    doc.write("</layer>")
  }
 
  if (browserVersion == 1) {
    this.navObj = doc.all["folder"+this.id]
    this.iconImg = doc.all["folderIcon"+this.id]
    this.nodeImg = doc.all["nodeIcon"+this.id]
  } else if (browserVersion == 2) {
    this.navObj = doc.layers["folder"+this.id]
    this.iconImg = this.navObj.document.images["folderIcon"+this.id]
    this.nodeImg = this.navObj.document.images["nodeIcon"+this.id]
    doc.yPos=doc.yPos+this.navObj.clip.height
  }
}
 
function outputFolderLink()
{
  if (this.hreference)
  {
    doc.write("<a href='" + this.hreference + "' TARGET=right ")
    if (browserVersion > 0)
      doc.write("onClick='javascript:clickOnFolder("+this.id+")'")
    doc.write(">")
  }
  else
    doc.write("<a>")
//  doc.write("<a href='javascript:clickOnFolder("+this.id+")'>")  
}
 
function addChild(childNode)
{
  this.children[this.nChildren] = childNode
  this.nChildren++
  return childNode
}
 
function folderSubEntries()
{
  var i = 0
  var se = this.nChildren
 
  for (i=0; i < this.nChildren; i++){
    if (this.children[i].children) //is a folder
      se = se + this.children[i].subEntries()
  }
 
  return se
}
 
 
// Definition of class Item (a document or link inside a Folder)
// *************************************************************
 
function Item(itemDescription, itemLink) // Constructor
{
  // constant data
  this.desc = itemDescription
  this.link = itemLink
  this.id = -1 //initialized in initalize()
  this.navObj = 0 //initialized in render()
  this.iconImg = 0 //initialized in render()
  this.iconSrc = "/img/ftv2doc.gif"
 
  // methods
  this.initialize = initializeItem
  this.createIndex = createEntryIndex
  this.hide = hideItem
  this.display = display
  this.renderOb = drawItem
  this.totalHeight = totalHeight
}
 
function hideItem()
{
  if (browserVersion == 1) {
    if (this.navObj.style.display == "none")
      return
    this.navObj.style.display = "none"
  } else {
    if (this.navObj.visibility == "hiden")
      return
    this.navObj.visibility = "hiden"
  }    
}
 
function initializeItem(level, lastNode, leftSide)
{ 
  this.createIndex()
 
  if (level>0)
    if (lastNode) //the last 'brother' in the children array
    {
      this.renderOb(leftSide + "<img src='/img/ftv2lastnode.gif' width=16 height=22>")
      leftSide = leftSide + "<img src='/img/ftv2blank.gif' width=16 height=22>" 
    }
    else
    {
      this.renderOb(leftSide + "<img src='/img/ftv2node.gif' width=16 height=22>")
      leftSide = leftSide + "<img src='/img/ftv2vertline.gif' width=16 height=22>"
    }
  else
    this.renderOb("")  
}
 
function drawItem(leftSide)
{
  if (browserVersion == 2)
    doc.write("<layer id='item" + this.id + "' top=" + doc.yPos + " visibility=hiden>")
    
  doc.write("<table ")
  if (browserVersion == 1)
    doc.write(" id='item" + this.id + "' style='position:block;' ")
  doc.write(" border=0 cellspacing=0 cellpadding=0>")
  doc.write("<tr><td>")
  doc.write(leftSide)
  doc.write("<a href=" + this.link + ">")
  doc.write("<img id='itemIcon"+this.id+"' ")
  doc.write("src='"+this.iconSrc+"' border=0>")
  doc.write("</a>")
  doc.write("</td><td valign=middle nowrap>")
  if (USETEXTLINKS)
  {
    if( this.link=="" )
    {
      doc.write("" + this.desc + "")
    }
    else
    {
      doc.write("<a href=" + this.link + ">" + this.desc + "</a>")
    }
  }
  else
    doc.write(this.desc)
  doc.write("</table>")
  
  if (browserVersion == 2)
    doc.write("</layer>")
 
  if (browserVersion == 1) {
    this.navObj = doc.all["item"+this.id]
    this.iconImg = doc.all["itemIcon"+this.id]
  } else if (browserVersion == 2) {
    this.navObj = doc.layers["item"+this.id]
    this.iconImg = this.navObj.document.images["itemIcon"+this.id]
    doc.yPos=doc.yPos+this.navObj.clip.height
  }
}
 
 
// Methods common to both objects (pseudo-inheritance)
// ********************************************************
 
function display()
{
  if (browserVersion == 1)
    this.navObj.style.display = "block"
  else
    this.navObj.visibility = "show"
}
 
function createEntryIndex()
{
  this.id = nEntries
  indexOfEntries[nEntries] = this
  nEntries++
}
 
// total height of subEntries open
function totalHeight() //used with browserVersion == 2
{
  var h = this.navObj.clip.height
  var i = 0
  
  if (this.isOpen) //is a folder and _is_ open
    for (i=0 ; i < this.nChildren; i++) 
      h = h + this.children[i].totalHeight()
 
  return h
}
 
 
// Events
// *********************************************************
 
function clickOnFolder(folderId)
{
  var clicked = indexOfEntries[folderId]
 
  if (!clicked.isOpen)
    clickOnNode(folderId)
 
  return 
 
  if (clicked.isSelected)
    return
}
 
function clickOnNode(folderId)
{
  var clickedFolder = 0
  var state = 0
 
  clickedFolder = indexOfEntries[folderId]
  state = clickedFolder.isOpen
 
  clickedFolder.setState(!state) //open<->close 
}
 
function initializeDocument()
{
  if (doc.all)
    browserVersion = 1 //IE4  
  else
    if (doc.layers)
      browserVersion = 2 //NS4
    else
      browserVersion = 0 //other
 
  foldersTree.initialize(0, 1, "")
  foldersTree.display()
 
  if (browserVersion > 0)
  {
    doc.write("<layer top="+indexOfEntries[nEntries-1].navObj.top+">&nbsp;</layer>")
 
    // close the whole tree
    clickOnNode(0)
    // open the root folder
    clickOnNode(0)
  }
}
 
// Auxiliary Functions for Folder-Treee backward compatibility
// *********************************************************
 
function gFld(description, hreference)
{
  description="<font style=font-size:9pt; font-color: #00ff00;background-color:#ccff99>" + description
  folder = new Folder(description, hreference)
  return folder
}
 
function gLnk(target, description, linkData)
{
  description="<font style=font-size:9pt; font-color: #0000ff;background-color:#ccff99>" + description
  fullLink = ""

  if( linkData!="" )
  {
  if (target==0)
  {
    fullLink = "'"+linkData+"' target=maincontent"
  }
  else
  {
    if (target==1)
       fullLink = "'http://"+linkData+"' target=_top"
    else
       fullLink = "'http://"+linkData+"' target=/"basefrm/""
  }
  }
 
  linkItem = new Item(description, fullLink)  
  return linkItem
}
 
function insFld(parentFolder, childFolder)
{
  return parentFolder.addChild(childFolder)
}
 
function insDoc(parentFolder, document)
{
  parentFolder.addChild(document)
}
 
// Global variables
// ****************
 
USETEXTLINKS = 1
indexOfEntries = new Array
nEntries = 0
doc = document
browserVersion = 0
selectedFolder=0
 

 

在jsp里面的代码如下。

 

<script language="JavaScript" src="/js/sitemap.js">
  </script>
  <script language="JavaScript">
  <!--
  
foldersTree = gFld("<b><font color='#336633'>組織層級架構</font></b>", "")

// ROOT 最頂層
<%
 for( int i=0; optlist!=null && i<optlist.size(); i++ ) {
  OrgPosition opt = (OrgPosition)optlist.get(i);
  
            if( opt.getParent_pos_id().length()<=0 ) {//看本来数据有没有上一层，如果没有foldersTree代替位置。
%>

//<%= "G" + opt.getPos_id() %> 随便写就是一个标志，

//<%= opt.getPos_name() %>显示的内容。

//(<%= opt.getDepth() %>) 可有可无。就是记录当前层次。（建议使用）

//<%= "G" + opt.getParent_pos_id() %>上一层标志

 


<%= "G" + opt.getPos_id() %> = insFld(foldersTree, gFld("<%= opt.getPos_name() %>(<%= opt.getDepth() %>) <a href='authorize.ModifyOrgPosition?todo=EDIT&pos_id=<%= opt.getPos_id() %>'>編輯</a> <a href='authorize.ModifyOrgPosition?todo=DEL&pos_id=<%= opt.getPos_id() %>'>刪除</a>", ""))
<%
            } else {
%>
<%= "G" + opt.getPos_id() %> = insFld(<%= "G" + opt.getParent_pos_id() %>, gFld("<%= opt.getPos_name() %>(<%= opt.getDepth() %>) <a href='authorize.ModifyOrgPosition?todo=EDIT&pos_id=<%= opt.getPos_id() %>'>編輯</a> <a href='authorize.ModifyOrgPosition?todo=DEL&pos_id=<%= opt.getPos_id() %>'>刪除</a>", ""))
<%
            }
 }
%>
initializeDocument()

function openAll() {
 for( i=1; i<=<%= optlist.size() %>; i++ ) {
      clickOnNode(i);
 }
}


  //-->
  </script>

sky_3013
关注
javascript数据结构
Sherry Tian的博客
09-18 1801
javascript数据结构你都知道哪些？
JS树结构操作:查找、遍历、筛选、树结构和列表结构相互转换
ch5256865的专栏
03-01 557
一、遍历树结构 1. 树结构介绍 JS中树结构一般是类似于这样的结构： let tree = [ { id: '1', title: '节点1', children: [ { id: '1-1', title: '节点1-1' }, { id: '1-2', title: '节点1-2' } ] }, { id: '2', ...
leetcode双人赛-js-structures:JS结构体问题及解决方法
06-30
leetcode双人赛 JS算法问题的结构和解决方案 在 mocha 中使用 NPM 和 JS 测试 npm install 运行测试 npm test JS数据结构实现 Single Linked List - 单链表实现和最常用的函数 [] Double Linked List - 双链表实现[] Queue - 使用双链表的队列实现 [] Stack - 自定义 JS 堆栈实现 [] Graph - JS Graph 实现 [] Binary Tree - JS 使用树节点的二叉树实现 [] Binary Search Tree - JS 二叉搜索树（继承）[] Min Heap - JS 最小堆，使用值数组 [] JS 帮手 Autogenerate a balanced binary search tree - 对于给定的初始值，自动生成平衡二叉搜索树。 [] 算法 BFS JS实现2 Leetcode问题解决 问题 洪水填充问题（已解决）：油漆问题。 给定一个由矩阵表示的图像，绘制一个像素 (src) 和所有相同颜色的邻居。 Shortes路径迷宫（已解决）：在平方矩阵中找
JS的构造函数
weixin_34326429的博客
05-13 212
  //构造函数 //使自己的对象多次复制，同时实例根据设置的访问等级可以访问其内部的属性和方法 //当对象被实例化后，构造函数会立即执行它所包含的任何代码 function myObject(msg){     //特权属性(公有属性)     this.myMsg = msg; //只在被实例化后的实例中可调用     this.address = '上海';          //私有...
js结构
weixin_30273501的博客
11-23 155
js包含三部分：ECMAScript,DOM,BOM ECMAScript:js核心，主要是关于js语法和基本对象 DOM：文档对象模型，获取页面元素进行操作 BOM：浏览器对象模型，对浏览器窗口进行操作 转载于:https://www.cnblogs.com/5201314m/p/10008356.html...
js 数据结构
青蛙king的博客
06-24 2545
二叉树
js查看object对象的属性结构
tianya111cy的专栏
07-09 636
function lookProperty(obj){ var ob=eval(obj); var property=""; for(var p in ob){ property+=p+"\n"; } alert(property); }
js代码-改造数组对象内部对象属性结构
07-16
在这个场景中，“js代码-改造数组对象内部对象属性结构”可能涉及到了以下几个关键知识点： 1. **数组遍历**：在JavaScript中，我们可以使用`for`循环、`forEach()`、`map()`、`reduce()`等方法遍历数组。例如，`...
使用jsTree实现js树形结构
06-07
jsTree 是一个强大的 JavaScript 库，专用于在 Web 页面上创建交互式的树形结构。它基于纯 JavaScript 编写，无需依赖其他库，因此对于初学者和有经验的开发者来说，都是一个易于理解和使用的工具。通过这个库，你...
JavaScript的组成结构梳理
weixin_33778778的博客
01-29 191
JavaScript经历了残酷的竞争，至今已经统治了web世界，现在系统梳理一下相关的知识。 JavaScript可以分为三部分：ECMAScript、DOM和BOM。 一、ECMAScript是JavaScript的核心,规定了这门语言的数据、语法、结构等基本概念。 Global是ECMAScript最顶级的对象(兜底对象),但体现在代...
JavaScript程序结构
qq_72013756的博客
09-01 1206
从零开始学前端
JavaScript的结构
qq_42601626的博客
10-25 639
** 流程控制 ** 为什么会有流程控制呢？代码执行不可能都是一行接着一行的去执行，所以出现了流程控制，出现了结构。 同样在实际项目中, 不可能都是简单的顺序结构(从上往下执行), 会出现不同的条件, 就要根据条件不同做出相应的处理，就有了流程控制。 js的基本结构 顺序结构，分支结构，循环结构。 顺序结构： 从上到下执行的代码就是顺序结构 程序默认就是从上到下,一行一行的顺序执行的 conso...
JS数据结构
mmsx2017的博客
04-09 660
一、标识符 标识符，说白了，就是一个名字。在JavaScript中，变量和函数等都需要定义一个名字，这个名字就可以称为“标识符”。 JavaScript语言中标识符最重要的3点就是： （1）第一个字符必须是字母、下划线（_）或美元符号这3种其中之一，其后的字符可以是字母、数字或下划线、美元符号； （2）变量名不能包含空格、加号、减号等符号； （3）标识符不能和JavaScript中用于其他目...
JavaScript的基本结构
weixin_43915557的博客
10-19 737
逻辑语句的基本结构以及被说烂了，但我这还是啰嗦一下吧。 实际中, 业务逻辑不可能都是简单的从上往下执行, 会出现不同的条件, 就要根据条件不同做出相应的处理 基本结构分为三种:顺序、选择、循环 顺序结构 从上到下执行的代码就是顺序结构 也就是程序默认的执行方式从上到下,一行一行的顺序执行的 console.log("1"); console.log("2"); console.log("3"); 选择结构 选择结构, 也叫分支结构 , 根据不同的情况,执行对应的代码 语法: va
Js_条件结构
ahty的专栏
07-25 499
 一、switch语句： 1.switch 语句中如果不存在break语句，则代码不会在匹配， 直接执行下面的代码，直到遇到break为止 2.case后面的条件一定不能重复！！！ 3.default可以写在上面，但是需要加break（通常写在最后） 如： var input=prompt("请输入一个字母")||
JavaScript基本结构
a1234556667的博客
09-20 2612
轮播图 常位于首页，用作活动推广的大图，其可以自动播放，点击左右切换按钮播放，也可以点击图片上的小圆点播放 Tab切换 用于点击不同的标签或标题，显示不同的内容 表单验证 常位于注册和登录页面，其用来在数据被送往服务器前对HTML表单中的输入数据进行验证。若输入的数据不正确，则会提示错误 什么是JavaScript JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言 其常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果 Ja...
JavaScript学习笔记（一）之JS应用程序的结构
你的目光温柔如水的博客
07-07 2076
一、'Hello JavaScript'    1.script标签属性type="text/javascrip" defer="defer" src=".js" charset=""defer表示该脚本不会生成任何文档内容。可以提高页面载入速度，特别是那些引用了大量JS代码或者庞大的JS程序库的页面。    2.注释//在代码中注释掉这一行 /*用来标记一行或多行注释*/    3.“隐藏”脚本...
js选择结构
杨文龙的博客
07-26 2200
1.丢弃小数部分,保留整数部分parseInt(m/n) 2.向上取整,有小数就整数部分加1  Math.ceil(m/n) 3.四舍五入.  Math.round(m/n) 4.向下取整  Math.floor(m/n) 5.m的n次幂：Math.pow( m, n)    var sex = prompt("请输入性别"); 定义的是个字符串类型 var we
Javascript中的8种常见数据结构（建议收藏）_js 数据结构
最新发布
2401_89841289的博客
01-11 771
** 链表中的节点 **/// 指向下一个节点的指针。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值