api.html

html树型结构 html树型结构

    	只读域，获得树
    	</td></tr>
  <tr>
    <td>treeArray</td>
    <td>Array:xyTree.Node</td>
    <td>(none)</td>
    <td>
    	只读域，获得树所有节点对应的一个简单的数组
    	</td></tr>

	</tbody>
</table>






<!-- 第6个类 -->
<br /><br /><br /><br /><br />
<a name="Node"><!-- --></a>
<h2>类 Node</h2>
<h6>	Node代表复选框节点。</h6>

关于给节点加属性：看<a href="#NodeNormal">NodeNormal</a>类的说明<br />
其实与NodeNormal类差别还是不小的，但是公共属性一样。
<ul>
<li>
动态添加节点的注意点同<a href="#DivTree">DivTree</a>上
</li>
<li>
颜色渐变方法slowChange()最后会强制节点文字的背景变成白色,可能有的用户的树的背景色不是白色的，
<br/>方法是:
<br/>在树初始化后，加一句：xyTree.CONSTANT.color = ['#ffff00','#ffff33','#ffff66','#ffff99','#ffffcc','#ffffff'];
把最后一项改成自己的背景色即可。
</li>
<li>
如果觉得颜色渐变方法时间太长的话，方法为
<br/>在树初始化后，加一句：xyTree.CONSTANT.timenum = 100;
把最后一项改成自己需要的时间即可。单位：毫秒
</li>

</ul>
	
<h4>另请参见：</h4>
<p>
	<a href="#DivTree">DivTree</a><br />
<a href="#Tree">Tree</a>
</p>
<table class="reference" cellspacing="0" border="1" width="100%">
  <tbody>
  <tr>
    <th width="25%">域和方法</th>
    <th width="25%">返回值</th>
    <th width="25%">参数</th>
    <th width="25%">描述</th></tr>
  <tr>
    <td width="25%">name</td>
    <td width="25%">Stirng</td>
    <td width="25%">(none)</td>
    <td width="25%">
    	只读域，节点名称，也就是在页面的显示
    	</td></tr>
  <tr>
    <td>img</td>
    <td>Stirng</td>
    <td>(none)</td>
    <td>
    	可读写域，节点的图标路径，初始化节点时指定或者不指定
    	</td></tr>
  <tr>
    <td>parent</td>
    <td>xyTree.Node</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的父节点，只有根节点的该属性值为null
    	</td></tr>
  <tr>
    <td>previous</td>
    <td>xyTree.Node</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的前一个节点
    	</td></tr>
  <tr>
    <td>next</td>
    <td>xyTree.Node</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的下一个节点
    	</td></tr>
  <tr>
    <td>child</td>
    <td>Array:xyTree.Node</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的子节点，数组成员类型还是xyTree.Node
    	</td></tr>
  <tr>
    <td>level</td>
    <td>int</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的级别，根节点为0
    	</td></tr>
  <tr>
    <td>tree</td>
    <td>xyTree.Tree</td>
    <td>(none)</td>
    <td>
    	只读域，获得节点的树对象，如要获得最外层的树则使用node.tree.divtree
    	</td></tr>

  <tr>
    <td>img</td>
    <td>String</td>
    <td>(none)</td>
    <td>
      可读写域，用来设置节点的图片url
      <br/>从以下版本开始：4.1
      </td></tr>

  <tr>
    <td>add(xyTree.Node node)</td>
    <td>(none)</td>
    <td>node:待添加的节点</td>
    <td>
    	给节点添加子节点
    	</td></tr>
  <tr>
    <td>addDynamic(xyTree.Node node)</td>
    <td>(none)</td>
    <td>node:动态添加的节点</td>
    <td>
      给节点动态添加子节点
      <br/>从以下版本开始：4.1
      </td></tr>
  <tr>
    <td>addDynamic(Array:xyTree.Node arr)</td>
    <td>(none)</td>
    <td>arr:动态添加的节点数组</td>
    <td>
      给节点批量的动态添加子节点
      <br/>从以下版本开始：4.1
      </td></tr>
	
  <tr>
    <td>addDynamic(Array:xyTree.Node arr)</td>
    <td>(none)</td>
    <td>arr:动态添加的节点数组</td>
    <td>
      给节点批量的动态添加子节点
      <br/>从以下版本开始：4.1
      </td></tr>

  <tr>
    <td>loadingGif()</td>
    <td>(none)</td>
    <td>(none)</td>
    <td>
      使节点的文件夹图标显示为调用的样子
      <br/>从以下版本开始：4.12
      </td></tr>

  <tr>
    <td>loadingGifRenew()</td>
    <td>(none)</td>
    <td>(none)</td>
    <td>
      使节点的文件夹图标显示从调用的样子恢复成正常模样
      <br/>从以下版本开始：4.12
      </td></tr>

  
  <tr>
    <td>slowChange()</td>
    <td>(none)</td>
    <td>(none)</td>
    <td>
      节点背景色渐变，默认300毫秒
      <br/>从以下版本开始：4.1
      </td></tr>
  <tr>
    <td>slowChange(int ms)</td>
    <td>(none)</td>
    <td>ms:渐变的ms间隔</td>
    <td>
      节点背景色渐变
      <br/>从以下版本开始：4.1
      </td></tr>
  <tr>
    <td>expand()</td>
    <td>(none)</td>
    <td>(none)</td>
    <td>
      把自己显示出来，在DivTree类中有类似方法，有渐变
      <br/>从以下版本开始：4.1
      </td></tr>
  <tr>
    <td>expandChecked()</td>
    <td>(none)</td>
    <td>(none)</td>
    <td>
      把自己显示出来并选中，在DivTree类中有类似方法，有渐变
      <br/>从以下版本开始：4.1
      </td></tr>
  <tr>
    <td>getNodeLink()</td>
    <td>Array:xyTree.Node</td>
    <td>(none)</td>
    <td>
      返回从根节点到自己的节点链，0是根节点，最后是自己
      <br/>从以下版本开始：4.1
      </td></tr>
  
  
  
  </tbody>
</table>







<br /><br /><br /><br /><br /><br />
<a name="gengxinshuoming"><!-- --></a>
更新说明：
<pre style="font:normal 12px 'Courier New';">
4.12版更新说明：(2007/07/27)
(1)修正重要bug：在IE浏览器中，如果设置
   IE->工具->Internet选项->常规->设置->每次访问此页时检查，
   那么图片会莫名其妙消失，现已更正。
   原因：
   单击链接<a href="......"></a>元素会有奇怪的特征，图片会消失
   解决方案：
   (1-1)去除html代码和javascript代码中的href属性，不用。
   (1-2)不知为何，样式中鼠标移上的样式没有显示。
   (1-3)使用万能的javascript，定义如下，样式当然随便：
     a.onmouseover = function (){this.style.color='blue';}
     a.onmouseout  = function (){this.style.color='black';}
(2)添加Node类的方法loadingGif()和loadingGifRenew()方法
   会使节点的文件夹图标显示为调用的样子，另一个恢复
(3)写了一个模拟ajax的示例，有些不满意，主要是
   其实节点是有子节点的，可是第一次显示出来时是个文件图标而非文件夹图标，
   加号也是的，将来可能会写一个AjaxTreeNormal类和AjaxTree类。
   难道要使用多重继承吗？不敢想象。
(4)小插曲：火狐中允许非标准数组写法[1,3,77,]，而IE中只有标准数组写法[1,3,77]      
   另：火狐中鼠标的指针样式cursor好像可选值要少一些，IE多一些
(5)这一版更新的文件很多，不再列举   
   

(2)本来说这一版要实现继承的，但未实现。为了不食言，定义为4.11版。
(3)关于IE显示图片丢失的情况，确保IE->工具->Internet选项->常规->
   设置->自动，情况就好多了。这也是IE默认配置。
   如果设置为“每次访问此页时检查”(显然是Web程序员的设置)会丢失图片，但在图片处右击鼠标，
   选择“显示图片”，倒也能显示，奇怪的IE。   

4.11版更新说明：(2007/07/21)
(1)添加DivTree树的第4个返回节点的函数getNodesDisplay，
   意思是根据当前树的展开形状返回最末级节点，这个最末级节点是眼睛看到的，
   不一定是真正的叶节点。
(2)本来说这一版要实现继承的，但未实现。为了不食言，定义为4.11版。
(3)关于IE显示图片丢失的情况，确保IE->工具->Internet选项->常规->
   设置->自动，情况就好多了。这也是IE默认配置。
   如果设置为“每次访问此页时检查”(显然是Web程序员的设置)会丢失图片，但在图片处右击鼠标，
   选择“显示图片”，倒也能显示，奇怪的IE。   

4.1版更新说明：(2007/06/16)
(1)使用方法大改变，现在用户只需把xyTree文件夹和html文件放到一起就可以了，
   目录结构更加清晰，更像是一个组件包了。
(2)添加了命名空间xyTree，为此修改了所有的js文件和css文件，还包括数据js文件.
   所以原先的用户需要替换程序js文件和css文件，还修改数据js文件，是有点麻烦。
(3)原先在html文件中是：
	document.getElementById('ceshi1').appendChild(treeXiaqu.div);
	treeXiaqu.init(); //这句话不会象前一版本默认有对话框弹出
   现在默认是点击复选框或文件夹（视哪种树而定，提供缺省单击的行为，见示例5和示例6），
   如果用户不满意，可以自己写回调函数，见下面的说明(8)
(4)去除了一个小bug，如果用户仍然想使用4.0版的树，可以，但必须自己改DivTree.js 
    第326行原先是 
    this.div.firstChild.firstChild.src = TreeConfigNormal.rootIcon; 
    应改成: 
    this.div.firstChild.firstChild.src = TreeConfig.rootIcon;
    第331行原先是 
    this.div.firstChild.firstChild.src = TreeConfigNormal.openRootIcon; 
    应改成: 
    this.div.firstChild.firstChild.src = TreeConfig.openRootIcon;
(5) 现在可以对节点方便的指定图片，如果不指定，就使用
    TreeConfig或TreeConfigNormal的缺省图片。
    不管哪种树，想指定根节点就在树(在js数据文件中)的构造方法的第二个参数填上图片路径，
    想指定节点的图标就在初始化节点时(在js数据文件中)加img属性，见文档中的说明。
    还可以改样式表第21行的样式，这个样式决定了指定的图片样式，而不会影响缺省图片的样式。
(6) 添加了一个复选框树的方法，initClearAllCheckBox(),
    可以清空树的所有被选中的复选框，树的形状不变。
(7) 添加了一个复选框树的方法，initTreeForm(),
    可以把树的节点展开形状恢复到初始状态，但节点的选中情况不变
(8) 添加了一个复选框树的方法，initReset(),
    可以清空树的所有被选中的复选框，并且把树的节点展开形状恢复到初始状态。
(9) 添加了我刚刚学会的回调函数的用法，           
    回调函数的用法是这样的：
    程序库中（就是我写的程序）
    function a(funb){
      //执行一些过程，结果保存在result变量中
      var result = /* 结果 */;
      funb(result);    //funb是个您写的函数的名称
    }
    而您写的程序（html或js）中有这个函数
    function funbbb(resu){
      alert(resu);
      /*在这里就得到了结果，可能是对象或数值，并可以随便使用*/
    }
    您这样调程序库
    a(funbbb);
    上面这句的意思是先到程序库中执行一个函数，然后，自动
    返回到您写的函数中，还能从参数中得到结果。参数的个数最好与库的开发者指定的个数相同。
    回调函数的好处是：隔离了库和用户，现在您不必修改程序库也可以自由使用（注意作用域）。
    当然您要改了再用，也没关系，改吧。
    这我这里，回调函数的确是一种“漂亮的解决方案”，
    主要是用户的html中树的初始化方法先暂时有两种。
    第一种：treeXiaqu.init();//提供默认的行为
    第二种：treeXiaqu.init(funa,funb)//见示例和文档
(10)可以动态添加节点了，不能删除，也不打算做，又开始跟刚开始写这个程序时一样鼓捣竖线，加号，文件夹
(11)节点的颜色渐变，
(12)还有一些琐碎方法不再列举了

    
    
    

4.0版更新说明：(2007/05/16)
1）在IE6.0和FireFox2.0上测试通过，其实就css文件里多了一句话
2）专门加了一个API使用文档。
3）为了在同一个文件中混合使用两种树，改类名了，
4）添加了隐藏树身和显示树身的方法

3.1版更新说明
(1)图片改成gif
(2)对对象的命名有了好方法。

3.0版更新说明：
新增方法：
(1)树的方法getNodesAll(),返回一个数组，所有被选中的节点（当然不含半灰色的节点，下同）
(2)树的方法getNodesMoji(),返回一个数组，末级所有被选中的节点，注意不一定是最后一层。
(3)把单击一般节点和根节点的方法放到DivTree.js文件的最后，方便使用者修改。
(4)单击一般节点的方法：clickNode()
(5)单击根节点的方法:clickRootNode()，一般用户都要修改
(6)又把单击根节点的图标的方式修改了，
   改成和最开始一样，点一下，其余节点消失，再点出现。
(7)试图用document.createDocumentFragment()优化代码，不过看起来没什么效果。

2007/02/09
新加方法判断是否根节点被选中
isSelectAll();
true表示被选中
false表示不被选中

</pre>
<br /><br /><br /><br /><br /><br />
</body>
</html>