​

Key features



  • Unlimited number of levels 无限级
  • Can be used with or without frames
  • Remembers the state of the tree between pages
  • Possible to have as many trees as you like on a page
  • All major browsers suported
  • Internet Explorer 5+
  • Netscape 6+
  • Opera 7+
  • Mozilla
  • Generates XHTML 1.0 strict validated output
  • Alternative images for each node

Adds a node to the tree.

Can only be called before the tree is drawn.

id, pid and name are required.

Parameters

Name

Type

Description

id

Number

Unique identity number.

pid

Number

Number refering to the parent node. The value for the root node has to be -1.

name

String

Text label for the node.

url

String

Url for the node.

title

String

Title for the node.

target

String

Target for the node.

icon

String

Image file to use as the icon. Uses default if not specified.

iconOpen

String

Image file to use as the open icon. Uses default if not specified.

open

Boolean

Is the node open.

 

Example

​​mytree.add(1, 0, 'My node', 'node.html', 'node title', 'mainframe', 'img/musicfolder.gif');​​




<head>
    <title>Destroydrop &raquo; Javascripts &raquo; Tree</title>

    <link rel="StyleSheet" href="dtree.css" type="text/css" />
    <script type="text/javascript" src="dtree.js"></script>

</head>

<body>

<h1><a href="/">Destroydrop</a> &raquo; <a href="/javascripts/">Javascripts</a> &raquo; <a href="/javascripts/tree/">Tree</a></h1>

<h2>Example</h2>

<div class="dtree">

    <p><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p>

    <script type="text/javascript">
        <!--

        d = new dTree('d');

        d.add(0,-1,'My example tree');
        d.add(1,0,'Node 1','example01.html');
        d.add(2,0,'Node 2','example01.html');
        d.add(3,1,'Node 1.1','example01.html');
        d.add(4,0,'Node 3','example01.html');
        d.add(5,3,'Node 1.1.1','example01.html');
        d.add(6,5,'Node 1.1.1.1','example01.html');
        d.add(7,0,'Node 4','example01.html');
        d.add(8,1,'Node 1.2','example01.html');
        d.add(9,0,'My Pictures','example01.html','Pictures I\'ve taken over the years','','','img/imgfolder.gif');
        d.add(10,9,'The trip to Iceland','example01.html','Pictures of Gullfoss and Geysir');
        d.add(11,9,'Mom\'s birthday','example01.html');
        d.add(12,0,'Recycle Bin','example01.html','','','img/trash.gif');

        document.write(d);

        //-->
    </script>

</div>


Js树型控件Dtree使用_css

​