javascript-ife笔记-javascript和树

2024-06-04 04:58
文章标签 java 笔记 script ife

本文主要是介绍javascript-ife笔记-javascript和树,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1、二叉树


二叉树遍历:

(1)前序遍历(DLR),首先访问根结点,然后遍历左子树,最后遍历右子树。简记根-左-右。(2)中序遍历(LDR),首先遍历左子树,然后访问根结点,最后遍历右子树。简记左-根-右。(3)后序遍历(LRD),首先遍历左子树,然后遍历右子树,最后访问根结点。简记左-右-根。 
前序遍历:


结果为:ABDHIEJCFKG

算法为:

function preOrder(node){if(!(node==null)){data.push(node);preOrder(node.firstElementChild);preOrder(node.lastElementChild);}
}
中序遍历:


结果为:HDIBEJAFKCG

算法:

function inOrder(node){if(!(node==null)){inOrder(node.firstElementChild);data.push(node);inOrder(node.lastElementChild);}
}
后序遍历:

结果为:HIDJEBKFGCA
算法:
function postOrder(node){if(!(node==null)){postOrder(node.firstElementChild);postOrder(node.lastElementChild);data.push(node);}
}

DOM小结:
1、Element.children:(只读)返回所有一级子元素(Element类型的)。
2、Element.className:返回该元素的class名字。
3、Element.firstElementChild:(只读)返回第一个子元素(Element类型,不存在返回null)。
4、Element.id:返回该元素的id。
5、Element.innerHTML:返回该元素内的所有内容。
6、Element.lastElementChild:只读)返回最后一个子元素(Element类型,不存在返回null)。
7、Element.nextElementSibling:(只读)返回当前元素在其父元素的子元素中的后一个元素节点,如果该元素已经是最后一个元素节点,返回null。
8、Element.outerHTML:获取该元素及其后代的HTML文本。(innerHTML不包含该元素本身)
9、Element.previousElementSibling:(只读)返回该元素上一个兄弟节点,不存在返回null。
10、Element.tagName:(只读)返回该元素的标签名。

查看任务二十二的源代码:

See the Pen ife_baidu-任务二十二-JavaScript和树(一) by tombflylee (@tombflylee) onCodePen.

2、多叉树:

深度优先遍历、广度优先遍历

1、深度优先遍历:

(1)访问顶点v;

(2)从v的未被访问的邻接点中选取一个顶点w,从w出发进行深度优先遍历;

(3)重复上述两步,直至图中所有和v有路径相通的顶点都被访问到。

例子:

one
  ├── two
  │   ├── five
  │   └── six
  ├── three
  └── four
      └── seven
遍历结果

'five'
'six'
'two'
'three'
'seven'
'four'
'one'
算法:

function traverseDF(node){for(var i=0;i<node.children.length;i++){traverseDF(node.children[i]);}data.push(node);
}
2、广度优先遍历:

结果:

'one'
'two'
'three'
'four'
'five'
'six'
'seven'
算法:

function traverseBF(node){
    if(node){data.push(node);traverseBF(node.nextElementSibling);node=data[index++];traverseBF(node.firstElementChild);}
}
DOM小结:很多DOM类型都从Node类型继承
1、Node.childNodes:(只读)返回所有子节点的集合(包括Element类型和Text类型。)
2、Node.firstChild:(只读)返回第一个子节点,即childNodes的第一个节点。
上述两者childNodes[0]和firstChild都受空格等的影响
<p id="para-01"><span>First span</span>
</p><script type="text/javascript">var p01 = document.getElementById('para-01');alert(p01.firstChild.nodeName)提示框将显示 '#text'
</script>
<p id="para-01"><span>First span</span></p>这样写不影响<script type="text/javascript">var p01 = document.getElementById('para-01');alert(p01.firstChild.nodeName)
</script>

3、Node.lastChild:(只读)返回最后一个子节点。
4、Node.nodeName:(只读)返回节点名称(如果是Element类型,返回Element.tagName;如果是Text类型,返回#text)
5、Node.nodeValue:获取或设置当前节点的值(如果是Element类型,返回null;如果是Text类型,返回文本节点的内容)
注意:在使用firstChild.nodeValue时,返回的字符会包含很多空白字符,
     所以firstChild.nodeValue.replace(/(^\s*)|(\s*$)/g,"")

6、Node.textContent:返回或设置一个节点的文本内容。
	(innerText是IE引用的,没有textContent好)
//   <div id="divA">This is <span>some</span> text</div>// 获得文本内容:
var text = document.getElementById("divA").textContent;
//"This is some text".// 设置文本内容:
document.getElementById("divA").textContent = "This is some text";
//   <div id="divA">This is some text</div>

查看任务二十三的源代码:

See the Pen ife_baidu-任务二十三-JavaScript和树(二) by tombflylee (@tombflylee) on CodePen.






这篇关于javascript-ife笔记-javascript和树的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1029125

相关文章

Java导入、导出excel用法步骤保姆级教程(附封装好的工具类)

《Java导入、导出excel用法步骤保姆级教程(附封装好的工具类)》:本文主要介绍Java导入、导出excel的相关资料,讲解了使用Java和ApachePOI库将数据导出为Excel文件,包括... 目录前言一、引入Apache POI依赖二、用法&步骤2.1 创建Excel的元素2.3 样式和字体2.

Java实现将Markdown转换为纯文本

《Java实现将Markdown转换为纯文本》这篇文章主要为大家详细介绍了两种在Java中实现Markdown转纯文本的主流方法,文中的示例代码讲解详细,大家可以根据需求选择适合的方案... 目录方法一:使用正则表达式(轻量级方案)方法二:使用 Flexmark-Java 库(专业方案)1. 添加依赖(Ma

Spring Boot拦截器Interceptor与过滤器Filter详细教程(示例详解)

《SpringBoot拦截器Interceptor与过滤器Filter详细教程(示例详解)》本文详细介绍了SpringBoot中的拦截器(Interceptor)和过滤器(Filter),包括它们的... 目录Spring Boot拦截器(Interceptor)与过滤器(Filter)详细教程1. 概述1

SpringBoot利用dynamic-datasource-spring-boot-starter解决多数据源问题

《SpringBoot利用dynamic-datasource-spring-boot-starter解决多数据源问题》dynamic-datasource-spring-boot-starter是一... 目录概要整体架构构想操作步骤创建数据源切换数据源后续问题小结概要自己闲暇时间想实现一个多租户平台,

Java反转字符串的五种方法总结

《Java反转字符串的五种方法总结》:本文主要介绍五种在Java中反转字符串的方法,包括使用StringBuilder的reverse()方法、字符数组、自定义StringBuilder方法、直接... 目录前言方法一:使用StringBuilder的reverse()方法方法二:使用字符数组方法三:使用自

JAVA封装多线程实现的方式及原理

《JAVA封装多线程实现的方式及原理》:本文主要介绍Java中封装多线程的原理和常见方式,通过封装可以简化多线程的使用,提高安全性,并增强代码的可维护性和可扩展性,需要的朋友可以参考下... 目录前言一、封装的目标二、常见的封装方式及原理总结前言在 Java 中,封装多线程的原理主要围绕着将多线程相关的操

Java进阶学习之如何开启远程调式

《Java进阶学习之如何开启远程调式》Java开发中的远程调试是一项至关重要的技能,特别是在处理生产环境的问题或者协作开发时,:本文主要介绍Java进阶学习之如何开启远程调式的相关资料,需要的朋友... 目录概述Java远程调试的开启与底层原理开启Java远程调试底层原理JVM参数总结&nbsMbKKXJx

Spring Cloud之注册中心Nacos的使用详解

《SpringCloud之注册中心Nacos的使用详解》本文介绍SpringCloudAlibaba中的Nacos组件,对比了Nacos与Eureka的区别,展示了如何在项目中引入SpringClo... 目录Naacos服务注册/服务发现引⼊Spring Cloud Alibaba依赖引入Naco编程s依

java导出pdf文件的详细实现方法

《java导出pdf文件的详细实现方法》:本文主要介绍java导出pdf文件的详细实现方法,包括制作模板、获取中文字体文件、实现后端服务以及前端发起请求并生成下载链接,需要的朋友可以参考下... 目录使用注意点包含内容1、制作pdf模板2、获取pdf导出中文需要的文件3、实现4、前端发起请求并生成下载链接使

Java springBoot初步使用websocket的代码示例

《JavaspringBoot初步使用websocket的代码示例》:本文主要介绍JavaspringBoot初步使用websocket的相关资料,WebSocket是一种实现实时双向通信的协... 目录一、什么是websocket二、依赖坐标地址1.springBoot父级依赖2.springBoot依赖