第JavaScript實現(xiàn)多叉樹的遞歸遍歷和非遞歸遍歷算法操作示例本文實例講述了JavaScript實現(xiàn)多叉樹的遞歸遍歷和非遞歸遍歷算法操作。分享給大家供大家參考，具體如下：

演示之前的準備工作

演示項目的文件結(jié)構(gòu)：

index.html

jsonData.js

recurrenceTree.js

noRecurrenceTree.js

解釋一下各個文件：

index.html是用來演示的HTML文件。

jsonData.js里面存儲著多叉樹的JSON數(shù)據(jù)。

recurrenceTree.js遞歸算法遍歷樹。

noRecurrenceTree.js非遞歸算法遍歷樹。

jsonData.js

*用于演示的JSON樹形數(shù)據(jù)結(jié)構(gòu)

varroot={

name:'D盤',

children:[

name:'學(xué)習(xí)',

children:[

name:'電子書',

children:[

name:'文學(xué)',

children:[

name:'茶館'

name:'紅與黑'

name:'電影',

children:[

name:'美國電影'

name:'日本電影'

index.html

!DOCTYPEhtml

htmllang="en"

head

metacharset="UTF-8"

metaname="renderer"content="webkit"/

metahttp-equiv="x-ua-compatible"content="ie=edge,chrome=1"

metahttp-equiv="Cache-Control"content="max-age:31536000"

titlejs多叉樹遍歷/title

metaname="viewport"content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"

metaname="wap-font-scale"content="no"

metaname="author"content=""

metaname="keywords"content=""

metaname="description"content=""

scripttype="text/javascript"src="jsonData.js"/script

/head

body

遞歸遍歷：spanid="app"/span

scripttype="text/javascript"src="recurrenceTree.js"/script

非遞歸遍歷：spanid="app2"/span

scripttype="text/javascript"src="noRecurrenceTree.js"/script

/body

/html

遞歸遍歷

recurrenceTree.js

//遍歷單個節(jié)點

functiontraverseNode(node){

vardivObj=document.getElementById("app");

divObj.innerHTML=divObj.innerHTML+""+;

//遞歸遍歷樹

//作者：張超

functiontraverseTree(node){

if(!node){

return;

traverseNode(node);

if(node.childrennode.children.length0){

vari=0;

for(i=0;inode.children.length;i++){

this.traverseTree(node.children[i]);

traverseTree(root);

非遞歸遍歷

noRecurrenceTree.js

//遍歷單個節(jié)點

functiontraverseNode2(node){

vardivObj2=document.getElementById("app2");

divObj2.innerHTML=divObj2.innerHTML+""+;

//非遞歸遍歷樹

//作者：張超

functiontraverseTree2(node){

if(!node){

return;

varstack=[];

stack.push(node);

vartmpNode;

while(stack.length0){

tmpNode=stack.pop();

traverseNode2(tmpNode);

if(tmpNode.childrentmpNode.children.length0){

vari=tmpNode.children.length-1;

for(i=tmpNode.children.length-1;ii--){

stack.push(tmpNode.children[i]);

traverseTree2(root);

本機測試效果：

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《Ja