html和js如何實現樹形菜單

(1)以父子關系為標準。

zTreeNodes

例如:

javascript，javascript

1.var zTreeNodes = [

2.{"id":1，" name":"test1 "，" nodes":[

3.{"id":11，" name":"test11 "，" nodes":[

4.{"id":111，" name ":" test 111 " }

5." id":12，" name":"test12"}

②父子關系簡單

排列

格式

(isSimpleData) zTreeNodes

例如:

javascript，javascript

1.var treeNodes = [

2.{"id":1，" pId":0，" name":"test1"}，

3.{"id":11，" pId":1，" name":"test11"}，

4.{"id":12，" pId":1，" name":"test12"}，

5.{"id":111，" pId":11，" name ":" test 111 " }，

示例:

(Java代碼)

(1)在頁面引用中

zTree的Js和css:

Html代碼

1.

& lt！- ZTree樹插件-& gt；

2.& lt環

rel= "樣式表"

href = " & lt% = root % & gt/Web/common/CSS/zTreeStyle/zTreeStyle . CSS "類型

= " text/CSS " & gt；

3.& lt！-& lt；link rel = " stylesheet " href = " & lt% = root % & gt/Web/common/CSS/zTreeStyle/ztreeicons . CSS " type = " text/CSS " >-& gt；

4.& ltscript type = " text/JavaScript " src = " & lt；% = root % & gt/Web/common/js/jquery-ztree-2.5 . min . js "

& gt& lt/script & gt；