一时兴起的需求是：用javascript自动生成html的目录树 效果是这个样子：
代码
虽然用了jQuery，但用的地方并不是很多，主要还是javascript。用的jQuery的版本是jquery-3.4.1.js
<script src
="jquery-3.4.1.js"></script
>
<script
>
$(document
).ready(function (){
var hs
=$("h2").siblings();
var con
=0;
for (var i
=0;i
<hs
.length
;i
++){
if(hs
[i
].localName
.charAt(0)=="h"){
hs
[i
].setAttribute("id","t"+con
);
var num
=parseInt(hs
[i
].localName
.charAt(1))-2;
while (num
--){
$("#cataStree").append(" ");
}
$("#cataStree").append("<a href='#t"+con
+"'>"+$(hs
[i
]).text()+"</a><br>");
con
++;
}
}
});
</script
>
哎，这个是纯自己写的，感觉挺繁重的。嗨嗨~
一个完整的html，demo
<!doctype html
>
<html
>
<head
>
<meta charset
='UTF-8'><meta name
='viewport' content
='width=device-width initial-scale=1'>
<title
>spring帮助文档
</title
></head
>
<style
>
a
:link
{
text
-decoration
:none
;
color
:black
;
}
a
:visited
{
text
-decoration
:none
;
color
:black
;
}a
:hover
{
text
-decoration
:none
;
color
: greenyellow
;
}
a
:active
{
text
-decoration
:none
;
color
:black
;
}
.cata
{
width
: 23%;
height
: 100%;
overflow
:hidden
;
float
: left
;
text
-overflow
:ellipsis
;
}
.text
{
width
: 77%;
height
: 100%;
float
: left
;
}
</style
>
<script src
="jquery-3.4.1.js"></script
>
<script
>
$(document
).ready(function (){
var hs
=$("h2").siblings();
var con
=0;
for (var i
=0;i
<hs
.length
;i
++){
if(hs
[i
].localName
.charAt(0)=="h"){
hs
[i
].setAttribute("id","t"+con
);
var num
=parseInt(hs
[i
].localName
.charAt(1))-2;
while (num
--){
$("#cataStree").append(" ");
}
$("#cataStree").append("<a href='#t"+con
+"'>"+$(hs
[i
]).text()+"</a><br>");
con
++;
}
}
});
</script
>
<body
>
<div id
="cataStree" class="cata"></div
>
<div
class="text">
<h2
>springboot
</h2
>
<h3
>springboot帮助
</h3
>
<h4
>简介
</h4
>
<p
>如果你接触过spring你会觉得spring开发数据库，网络编程真的简单，当你学完springboot后你会觉的springboot就是个神器。开发是真的高效率。
</p
>
<p
>我对springboot的理解就是，对spring的再一次封装，springboot的底层还是调用spring。
</p
>
<h4
>特点
</h4
>
<ul
>
<li
>创建独立的Spring应用程序
</li
>
<li
>直接嵌入Tomcat，Jetty或Undertow（无需部署
WAR文件）
</li
>
<li
>提供自以为是的“入门”依赖项，以简化构建配置
</li
>
<li
>尽可能自动配置Spring和
3rd Party库
</li
>
<li
>提供可用于生产的功能，例如指标，运行状况检查和外部化配置
</li
>
<li
>完全没有代码生成，也不需要
XML配置
</li
>
</ul
>
<h4
>配置文件
</h4
>
<h4
>自动生成的引导类
</h4
>
<p
>这个作为springboot启动引导类，使项目的启动入口。其他写的逻辑业务代码包必须是在这个类的同包或者是子包。
</p
>
<p
>@SpringBootApplication标记启动类
</p
>
<pre
><code
class='language-java' lang
='java'>
@SpringBootApplication
public class QuickApplication {
public static void main(String
[] args
) {
SpringApplication
.run(QuickApplication
.class, args
);
}
}
</code
></pre
>
<p
> 
;</p
>
<h3
>springboot注解帮助
</h3
>
<h4
>@RequestBody与@
RequestParam()</h4
>
<p
>@RequestBody
</p
>
<p
>主要用来
<strong
>接收前端传递给后端的json字符串中的数据
</strong
>(请求体中的数据的
)；
</p
>
<p
>GET方式无请求体，所以使用@RequestBody接收数据时，前端不能使用
GET方式提交数据，而是用
POST方式进行提交。
</p
>
<p
>@RequestBody与@
RequestParam()可以同时使用，@RequestBody最多只能有一个，而@
RequestParam()可以有多个。
</p
>
<h4
>@RestController
</h4
>
<p
>已准备好使用该类来处理Web请求。
</p
>
<p
>这是因为@RestController将@Controller和@ResponseBody组合在一起。即@RestController
=@ResponseBody ＋ @Controller。
</p
>
<h4
>@ResponseBody
</h4
>
<p
>返回json或xml数据到前台页面
</p
>
<h4
>@RequestMapping
</h4
>
<p
>使用@
RequestMapping("
;/a
"
;)来映射请求
,下面给出栗子：
</p
>
<pre
><code
class='language-java' lang
='java'>@Controller
public class web1 {
@
RequestMapping("
;/m1
"
;)
@ResponseBody
public String
m1(){
return "
;你好啊
"
;;
}
}
</code
></pre
>
<p
> 
;</p
>
</div
>
</body
>
</html
>
