閱讀(3.9k) 書簽贊(1) 我要糾錯(cuò)

強(qiáng)大的Js樹型控件Dtree使用詳解

2018-06-23 16:04 更新

常用方法

add(parameters)：添加節(jié)點(diǎn)信息

【例】mytree.add(1, 0, 'My node', 'node.html', 'node title', 'mainframe', 'img/musicfolder.gif'); 【注】dtree.js文件中約87－113行是一些默認(rèn)圖片的路徑，可以自己配置圖片 openAll()：打開所有節(jié)點(diǎn)，可在樹被創(chuàng)建以前或以后調(diào)用【例】mytree.openAll(); closeAll()：關(guān)閉所有節(jié)點(diǎn)，可在樹被創(chuàng)建以前或以后調(diào)用【例】mytree.closeAll(); oAll(bool)：打開或關(guān)閉所有節(jié)點(diǎn)參數(shù)為true則打開所有節(jié)點(diǎn)，false則關(guān)閉所有節(jié)點(diǎn) isOpen(id)：指定節(jié)點(diǎn)是否處于打開狀態(tài)如果處于打開狀態(tài)則返回true,反之false openTo(parameters)打開指定節(jié)點(diǎn)可在樹被創(chuàng)建以前或以后調(diào)用

o(index) 打開/關(guān)閉指定節(jié)點(diǎn)，如果節(jié)點(diǎn)處于關(guān)閉狀態(tài)則打開，反之則關(guān)閉 openTo()方法體內(nèi)調(diào)用的就是o()方法 OPENTO(ID)和O(ID)比較

下面分別用兩種方法打開’MacBookPro系列’節(jié)點(diǎn)

1,openTo()直接打開

2,o()表面看起來沒反應(yīng)，只有點(diǎn)開“蘋果”節(jié)點(diǎn)才能看到

dtree的配置CONFIG

配置干嘛用的？其實(shí)配置就是在樹初始化時(shí)對某些效果進(jìn)行一些必要的設(shè)置，比如config.useIcons=false 意思就是所有節(jié)點(diǎn)不顯示圖片了;

【例子】mytree.config.target = "mytarget";

頁面中的書寫規(guī)范

1,參數(shù)可以不寫完，有默認(rèn)值（從左至右，依次省略）,例tree.add(id,pid,name,url);后面5個(gè)參數(shù)就可以省略 2,有間隔時(shí)的默認(rèn)值（如存在第6個(gè)參數(shù)，但第5個(gè)參數(shù)想用默認(rèn)值）,即tree.add(id,pid,name,url,"",target);必須這樣寫tree.add(id,pid,name,url,"","","","",true); 3,特殊：如果需要顯示title(參數(shù)5)必須設(shè)定相應(yīng)鏈接地址(參數(shù)4),tree.add(2,0,‘照明控制系統(tǒng)’,‘a(chǎn).jsp’,‘這是第四個(gè)參數(shù)title’);?//如果第四個(gè)參數(shù)為空則無法顯示

高手進(jìn)階

1,JS創(chuàng)建類對象


JS對象是一種復(fù)合類型，它允許你通過變量名存儲(chǔ)和訪問，換一種思路，對象是一個(gè)無序的屬性集合，集合中的每一項(xiàng)都由名稱和值組成（聽起來是不是很像我們常聽說的HASH表、字典、健/值對？），而其中的值類型可能是內(nèi)置類型(如number,string)，也可能是對象。

2,Js的prototype(原型)是什么


用來返回對象類型原型的引用,我們使用prototype屬性提供對象的類的一組基本功能。并且對象的新實(shí)例會(huì)"繼承"賦予該對象原型的操作。

3,了解一些DTRR.JS內(nèi)的屬性


(1)Node類：
    1,this._io = open || false;? //is open? 
    2, this._is = false;? //is selected? 
    3, this._ls = false;? //last sibling? 
    4, this._hc = false;? //has child?

(2)dtree類： 1, this.obj = objName; //對象別名，new dtree時(shí)可用 2, this.aNodes = []; //節(jié)點(diǎn)數(shù)組，每個(gè)下標(biāo)存一個(gè)節(jié)點(diǎn)

(3)一些可能使用的方法 1,closeLevel(node)關(guān)閉當(dāng)前node節(jié)點(diǎn)同級的節(jié)點(diǎn),假設(shè)與a節(jié)點(diǎn)同級的有b和c節(jié)點(diǎn)，而且a、b、c節(jié)點(diǎn)都打開了子節(jié)點(diǎn)，此時(shí)調(diào)用closeLevel(a)，b、c節(jié)點(diǎn)會(huì)收攏起來，但a節(jié)點(diǎn)不會(huì)收攏。例：closeLevel(tree.aNodes[1]) –假設(shè)下標(biāo)1是a

2,getSelected()返回你選擇的節(jié)點(diǎn)的信息,返回的是一個(gè)node對象。例：getSelected().id就能返回選擇的節(jié)點(diǎn)的id

3,setCS(node)查看節(jié)點(diǎn)是否有子節(jié)點(diǎn)或者是最后一個(gè)節(jié)點(diǎn),方法體內(nèi)存有’_hc’表示是否有子節(jié)點(diǎn)，而’_ls’表示最后的葉子節(jié)點(diǎn)

特別注意：aNodes[1]和o(1)等這里的下標(biāo)絕對不是指add(id,pid..)里的節(jié)點(diǎn)id，而是根據(jù)整個(gè)樹形結(jié)構(gòu)按層次遞加分配的。