小程序原型设计工具_JavaScript完成多叉树的递归遍

发布时间:2021-01-08 16:41 作者:jianzhan

摘要: JavaScript完成多叉树的递归解析xml和非递归解析xml优化算法实际操作实例 本文关键详细介绍了JavaScript完成多叉树的递归解析xml和非递归解析xml优化算法,融合案例方式详尽剖析了J

JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例       这篇文章主要介绍了JavaScript实现多叉树的递归遍历和非递归遍历算法,结合实例形式详细分析了JavaScript多叉树针对json节点的递归与非递归遍历相关操作技巧,需要的朋友可以参考下

本文实例讲述了JavaScript实现多叉树的递归遍历和非递归遍历算法操作。分享给大家供大家参考,具体如下:

演示之前的准备工作

演示项目的文件结构:

<
jsonData.js
recurrenceTree.js
noRecurrenceTree.js

解释一下各个文件:

< 是用来演示的 HTML 文件。
jsonData.js 里面存储着多叉树的JSON数据。
recurrenceTree.js 递归算法遍历树。
noRecurrenceTree.js 非递归算法遍历树。

jsonData.js

 * 用于演示的 JSON 树形数据结构
var root = {
 name:'D盘',
 children:[
 name:'学习',
 children:[
 name:'电子书',
 children:[
 name:'文学',
 children:[
 name:'茶馆'
 name:'红与黑'
 name:'电影',
 children:[
 name:'美国电影'
 name:'日本电影'
<

 !DOCTYPE html 
 html lang="en" 
 head 
 meta charset="UTF-8" 
 meta name="renderer" content="webkit"/ 
 meta http-equiv="patible" content="ie=edge, chrome=1" 
 meta http-equiv="Cache-Control" content="max-age: " 
 title  js多叉树遍历 /title 
 meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" 
 meta name="wap-font-scale" content="no" 
 meta name="author" content="" 
 meta name="keywords" content="" 
 meta name="description" content="" 
 script type="text/javascript" src="jsonData.js" /script 
 /head 
 body 
 递归遍历: span id="app" /span 
 script type="text/javascript" src="recurrenceTree.js" /script 
 非递归遍历: span id="app2" /span 
 script type="text/javascript" src="noRecurrenceTree.js" /script 
 /body 
 /html 

递归遍历

recurrenceTree.js

// 遍历单个节点
function traverseNode(node){
 var divObj = document.getElementById("app");
 divObj.innerHTML = divObj.innerHTML + " " + node.name;
// 递归遍历树
// 
function traverseTree(node){
 if (!node) {
 return;
 traverseNode(node);
 if (node.children node.children.length 0) {
 var i = 0;
 for (i = 0; i node.children.length; i++) {
 this.traverseTree(node.children[i]);
traverseTree(root);

非递归遍历

noRecurrenceTree.js

// 遍历单个节点
function traverseNode2(node){
 var divObj2 = document.getElementById("app2");
 divObj2.innerHTML = divObj2.innerHTML + " " + node.name;
// 非递归遍历树
// 
function traverseTree2(node){
 if (!node) {
 return;
 var stack = [];
 stack.push(node);
 var tmpNode;
 while (stack.length 0) {
 tmpNode = stack.pop();
 traverseNode2(tmpNode);
 if (tmpNode.children tmpNode.children.length 0) {
 var i = tmpNode.children.length - 1;
 for (i = tmpNode.children.length - 1; i i--) {
 stack.push(tmpNode.children[i]);
traverseTree2(root);

本机测试效果:

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《》、《》、《》、《》、《》及《》

希望本文所述对大家JavaScript程序设计有所帮助。


  • 国内有什么好的自助建站

    《说真话!除开自助式式建设网站,大家可否玩点新的?》随着着互联网制造行业的很快发展趋势发展趋势,中小型型企业对基建项目本身公司的官方网网站规定越来越越越大,互联网

  • 族蚂自助建站平台真的又

    很多人来运用了自助式式建设网站专用型专用工具之后,早期感觉还十分好,赶到后半期难点就渐渐地的裸露出来了,不管是房间内室内空间不够用,还是网页页面没法浏览。有的根本

  • 为什么全国的旅游景点没

    为何不动传出对于度假旅游的自助式取/买票机,如同铁路线系统软件那般的?每一次去旅游景点必须排较长的队,十分便捷。自助式式取票机相对性性人力资源售票处处,运营维护保养

  • “低成本”的自助建站,

    网站是每家企业官方网网的互联网本人个人名片及信息内容內容会话框,一个较为比较好的网站能帮助企业构建自身优质知名品牌品牌形象。目前市场销售销售市场在网上站基建项目方

  • 国内的一些云主机销售网

    中国的公有制云企业,比如:鸟儿云 - 公司级云服务器器、虚似服务器、网络服务器租赁代管服务供应商 (鸟儿云)、美猴云服务器器-云服务器 (美猴云),这种企业是怎样完成在前台接