css文件加载:@import和link的区别

本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。

使用CSS的三种方式

页面中使用CSS的方式主要有3种:

  • 行内添加定义style属性值,
  • 页面头部内嵌,
  • 调用和外面链接调用,其中外面引用有两种:
    • link@import

@impot使用方法

1
2
3
4
5
6
<style type="text/css">
<!--
@import url("css/main.css");
@import url("css/base.css");
-->
</style>

link的使用方法

1
<link href="css/main.css" rel="stylesheet" type="text/css"/>

区别

功能上的区别

  • linkXHTML标签,除了加载CSS外,还可以定义RSS等其他事务;
  • @import属于CSS范畴,只能加载CSS

加载顺序上的区别

  • 当一个页面被加载的时候(就是被浏览者浏览的时候),**link引用的CSS会同时被加载**,
  • 而**@import引用的CSS会等到页面全部被下载完再被加载**。
  • 所以有时候浏览@import加载CSS的页面时开始会没有样式,后面样式加载出来后网页会闪烁。

兼容性上的区别

  • linkXHTML标签,无兼容问题
  • 由于**@importCSS2.1提出的所以老的浏览器不支持**,

dom支持上的区别

  • link支持使用Javascript控制DOM去改变样式
  • @import不支持。

嵌套支持上的区别

  • @import可以在css中再次引入其他样式表,比如可以创建一个主样式表,在主样式表中再引入其他的样式表,这样更利于修改和扩展。如下所示:

main.css

1
2
@import “sub1.css”;
@import “sub2.css”;

sub1.css

1
p {color:red;}

sub2.css

1
.myclass {color:blue}

总结

从上面的分析来看,还是使用link标签比较好。标准网页制作加载CSS文件时,还应该选定要加载的媒体(media),比如screenprint,或者全部all等。

提示:这样做有一个缺点,会对网站服务器产生过多的HTTP请求,以前是一个文件,而现在却是两个或更多文件了,服务器的压力增大,浏览量大的网站还是谨慎使用。有兴趣的可以观察一下像新浪等网站的首页或栏目首页代码,他们总会cssjs直接写在html里,而不用外部文件

参考资料

https://www.cnblogs.com/pp-cat/p/4001628.html
https://blog.csdn.net/sinat_36414515/article/details/80392321

css文件加载:@import和link的区别

本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。

使用CSS的三种方式

页面中使用CSS的方式主要有3种:

  • 行内添加定义style属性值,
  • 页面头部内嵌,
  • 调用和外面链接调用,其中外面引用有两种:
    • link@import

@impot使用方法

1
2
3
4
5
6
<style type="text/css">
<!--
@import url("css/main.css");
@import url("css/base.css");
-->
</style>

link的使用方法

1
<link href="css/main.css" rel="stylesheet" type="text/css"/>

区别

功能上的区别

  • linkXHTML标签,除了加载CSS外,还可以定义RSS等其他事务;
  • @import属于CSS范畴,只能加载CSS

加载顺序上的区别

  • 当一个页面被加载的时候(就是被浏览者浏览的时候),**link引用的CSS会同时被加载**,
  • 而**@import引用的CSS会等到页面全部被下载完再被加载**。
  • 所以有时候浏览@import加载CSS的页面时开始会没有样式,后面样式加载出来后网页会闪烁。

兼容性上的区别

  • linkXHTML标签,无兼容问题
  • 由于**@importCSS2.1提出的所以老的浏览器不支持**,

dom支持上的区别

  • link支持使用Javascript控制DOM去改变样式
  • @import不支持。

嵌套支持上的区别

  • @import可以在css中再次引入其他样式表,比如可以创建一个主样式表,在主样式表中再引入其他的样式表,这样更利于修改和扩展。如下所示:

main.css

1
2
@import “sub1.css”;
@import “sub2.css”;

sub1.css

1
p {color:red;}

sub2.css

1
.myclass {color:blue}

总结

从上面的分析来看,还是使用link标签比较好。标准网页制作加载CSS文件时,还应该选定要加载的媒体(media),比如screenprint,或者全部all等。

提示:这样做有一个缺点,会对网站服务器产生过多的HTTP请求,以前是一个文件,而现在却是两个或更多文件了,服务器的压力增大,浏览量大的网站还是谨慎使用。有兴趣的可以观察一下像新浪等网站的首页或栏目首页代码,他们总会cssjs直接写在html里,而不用外部文件

参考资料

https://www.cnblogs.com/pp-cat/p/4001628.html
https://blog.csdn.net/sinat_36414515/article/details/80392321

git error:bad signature

**解决方案:**删除index文件再重新生成

1
2
rm -f .git/index
git reset

ERROR: You must verify your email address.

今天使用Hexo发布博客时,报了如下错误:

1
2
3
4
5
6
7
8
9
10
11
12
13
ERROR: You must verify your email address.
See https://github.com/settings/emails.
fatal: Could not read from remote repository.
Please make sure you have the correct access rights
and the repository exists.
FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubleshooting.html
Error: Spawn failed
at ChildProcess.<anonymous> (E:\Blog\blog6\node_modules\hexo-util\lib\spawn.js:52:19)
at emitTwo (events.js:126:13)
at ChildProcess.emit (events.js:214:7)
at ChildProcess.cp.emit (E:\Blog\blog6\node_modules\cross-spawn\lib\enoent.js:40:29)
at Process.ChildProcess._handle.onexit (internal/child_process.js:198:12)

这是因为邮箱突然没有通过验证,具体怎么回事不知道.打开提示的链接https://github.com/settings/emails,然后重新验证就好了:
这里有一张图片
这时github会给你发邮件,打开邮箱接收邮件,然后点击按钮验证即可:
这里有一张图片

参考资料

https://www.jianshu.com/p/d478f6fd381b

问题描述

最近先现实项目的目录结构,查了一下cmd之后由tree命令,但是项目中有些目录和文件(如.class文件)是项目自动生成的,并不全部显示出来,我这想显示该项目必须要有的目录和文件即可,对于IDE等工具生成的目录忽略掉。这样使用cmd提供的tree命令无法满足我的要求,我有必要自己实现一个tree命令。下来是我用java实现的一个满足我特定要求的tree命令。

文件名称过滤器

默认文件

1
2
3
4
5
6
7
8
9
10
11
package tree;
import java.io.File;
import java.io.FilenameFilter;
public class DefaultFileNameFileter implements FilenameFilter
{
@Override
public boolean accept(File dir, String name)
{
return true;
}
}

Maven Java Web项目文件名称过滤器

对于项目中的.setting目录,bin目录,.class文件.project文件,这些文件都是eclipse自动生成的,在打印项目目录时候,这些目录都不需要打印出来.为了满足这个需求我使用文件名过滤器。代码如下所示:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
package tree;
import java.io.File;
import java.io.FilenameFilter;
public class MavenJavaWebFileNameFilter implements FilenameFilter
{
private String RootPath = null;
MavenJavaWebFileNameFilter(String RootPath)
{
this.RootPath = RootPath;
}
@Override
public boolean accept(File dir, String name)
{
// 该文件不能以点号开头,
// 也不能以txt文件结尾
// 文件名称不能是bin
// 文件名称不能是target
if (name.startsWith(".") || name.endsWith(".txt"))
{
return false;
}
// 如果是根目录
if (RootPath.equals(dir.getAbsolutePath()))
{
// 第一级目录下的bin目录,
// 或者target目录(maven,输出)不是java项目必须目录所以不输出
if ("bin".equals(name) || "target".equals(name)
|| "test".equals(name))
{
return false;
}
}
return true;
}
}

打印目录树主类 MyTree.java

MyTree.java用来打印目录树,如下所示:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
package tree;
import java.io.File;
import java.io.FilenameFilter;
public class MyTree
{
private static String RootPath = null;
private static MavenJavaWebFileNameFilter mavenJaveWebFileNameFilter = null;
private static DefaultFileNameFileter defaultFileNameFileter=new DefaultFileNameFileter();
public static void main(String args[])
{
// String path = "E:\\workspace\\Regex";
// String path = "E:\\workspace_web\\app17a";
// 通过剪贴板读入目录
// String path =SysClipboardUtil.getSysClipboardText();
// 使用当前目录作为目录
String path = System.getProperty("user.dir");
// 保存根目录,后续要用到
RootPath = path;
mavenJaveWebFileNameFilter = new MavenJavaWebFileNameFilter(RootPath);
File dir = new File(path);
switch (args.length)
{
case 1 :
oneArgs(args, dir);
break;
default :
printTreeDir(dir);
break;
}
}
/**
* 输入一个参数的情况.
*
* @param args
* 参数列表
* @param dir
* 目录的File对象.
*/
private static void oneArgs(String[] args, File dir)
{
// TODO Auto-generated method stub
String arg1 = args[0];
switch (arg1)
{
case "f" :
printTreeFileAndDir(dir, defaultFileNameFileter);
break;
case "java" :
printTreeFileAndDir(dir, mavenJaveWebFileNameFilter);
break;
default :
break;
}
}
/**
* 打印dir表示的目录的目录树.
*
* @param dir
* 表示目录的File对象.
*/
public static void printTreeDir(File dir)
{
System.out.println(dir.getAbsolutePath());
printTreeDir(dir, "", 0);
}
/**
* @param dir
*/
private static void printTreeDir(File dir, String prefix, int deep)
{
if (dir.isDirectory())
{
// 生成目录下的子目录列表
File[] dirList = dir.listFiles(new FilenameFilter()
{
@Override
public boolean accept(File dir, String name)
{
// 该文件是目录,并且不能以点号开头,
// 点号开头的一般是隐藏文件
return new File(dir, name).isDirectory()
&& !name.startsWith(".");
}
});
String thisPrefix = "";
String nextPrefix = "";
for (int i = 0; i < dirList.length; i++)
{
if (deep >= 0)
{
// 如果不是最后一个元素
if ((i + 1 < dirList.length))
{
// 不是最后一个目录都打印这个符号
thisPrefix = prefix + "├─";
// 下一个打印这符号表示展开目录
nextPrefix = prefix + "│ ";
} else
{
// 最后一个子目录项
thisPrefix = prefix + "└─";
//
nextPrefix = prefix + " ";
}
}
System.out.println(thisPrefix + dirList[i].getName());
printTreeDir(dirList[i], nextPrefix, deep + 1);
}
}
}
/**
* @param dir
*/
public static void printTreeFileAndDir(File dir,FilenameFilter fileNameFilter)
{
// 打印根目录
System.out.println(dir.getAbsolutePath());
printTreeFileAndDir(dir, fileNameFilter,"", 0);
}
/**
* 打印目录树
*
* @param dir
* 目录
* @param prefix
* 前缀,需要打印在文件或者目录之前
* @param deep
* 深度
*/
private static void printTreeFileAndDir(File dir,
FilenameFilter fileNameFilter, String prefix, int deep)
{
// 列出目录下的子目录
File[] childs = dir.listFiles(fileNameFilter);
// 遍历子目录
for (int i = 0; i < childs.length; i++)
{
// 本次递归的前缀
String thisPrefix = "";
// 下一个递归的前缀
String nextPrefix = "";
if (deep >= 0)
{
// 如果不是最后一个元素
if ((i + 1 < childs.length))
{
nextPrefix = prefix + "│ ";
thisPrefix = prefix + "├─";
} else
{
nextPrefix = prefix + " ";
thisPrefix = prefix + "└─";
}
}
System.out.println(thisPrefix + childs[i].getName());
if (childs[i].isDirectory())
{
printTreeFileAndDir(childs[i], fileNameFilter, nextPrefix,
deep + 1);
}
}
}
}

MyTree程序参数说明

不带参数

该程序默认不带参数,默认情况下只打印当前目录下的所有非点号.开头的目录

带一个参数

目前该程序只允许带一个参数,如下所示:

  • f参数:不仅打印目录,还会打印目录下的文件.
  • java参数,显示java项目的目录结构,隐藏IDE等工具生成的文件

运行结果

只打印目录

执行程序,不带任何参数将会只打印目录

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
E:\workspace_web\app17a
├─src
│ ├─main
│ │ ├─java
│ │ │ └─app17a
│ │ │ ├─controller
│ │ │ ├─domain
│ │ │ └─form
│ │ ├─resources
│ │ └─webapp
│ │ ├─css
│ │ ├─META-INF
│ │ └─WEB-INF
│ │ ├─jsp
│ │ └─lib
│ └─test
│ └─java
└─target
├─classes
│ └─app17a
│ ├─controller
│ ├─domain
│ └─form
├─m2e-wtp
│ └─web-resources
│ └─META-INF
│ └─maven
│ └─com.lan
│ └─app17a
└─test-classes

打印目录和文件

使用参数f,将打印目录和文件,如下所示:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
E:\workspace_web\app17a
├─.classpath
├─.project
├─.settings
│ ├─.jsdtscope
│ ├─org.eclipse.jdt.core.prefs
│ ├─org.eclipse.m2e.core.prefs
│ ├─org.eclipse.wst.common.component
│ ├─org.eclipse.wst.common.project.facet.core.xml
│ ├─org.eclipse.wst.jsdt.ui.superType.container
│ ├─org.eclipse.wst.jsdt.ui.superType.name
│ └─org.eclipse.wst.validation.prefs
├─pom.xml
├─src
│ ├─main
│ │ ├─java
│ │ │ └─app17a
│ │ │ ├─controller
│ │ │ │ ├─InputProductController.java
│ │ │ │ └─SaveProductController.java
│ │ │ ├─domain
│ │ │ │ └─Product.java
│ │ │ └─form
│ │ │ └─ProductForm.java
│ │ ├─resources
│ │ └─webapp
│ │ ├─css
│ │ │ └─main.css
│ │ ├─index.jsp
│ │ ├─META-INF
│ │ │ └─MANIFEST.MF
│ │ └─WEB-INF
│ │ ├─jsp
│ │ │ ├─ProductDetails.jsp
│ │ │ └─ProductForm.jsp
│ │ ├─lib
│ │ ├─springmvc-servlet.xml
│ │ └─web.xml
│ └─test
│ └─java
└─target
├─classes
│ └─app17a
│ ├─controller
│ │ ├─InputProductController.class
│ │ └─SaveProductController.class
│ ├─domain
│ │ └─Product.class
│ └─form
│ └─ProductForm.class
├─m2e-wtp
│ └─web-resources
│ └─META-INF
│ ├─MANIFEST.MF
│ └─maven
│ └─com.lan
│ └─app17a
│ ├─pom.properties
│ └─pom.xml
└─test-classes

显示Maven Java Web项目结构

输入参数java,将调用这个功能.这个是我定制的功能,可能还是有些不足的地方,先这样用吧.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
E:\workspace_web\app17a
├─pom.xml
└─src
├─main
│ ├─java
│ │ └─app17a
│ │ ├─controller
│ │ │ ├─InputProductController.java
│ │ │ └─SaveProductController.java
│ │ ├─domain
│ │ │ └─Product.java
│ │ └─form
│ │ └─ProductForm.java
│ ├─resources
│ └─webapp
│ ├─css
│ │ └─main.css
│ ├─index.jsp
│ ├─META-INF
│ │ └─MANIFEST.MF
│ └─WEB-INF
│ ├─jsp
│ │ ├─ProductDetails.jsp
│ │ └─ProductForm.jsp
│ ├─lib
│ ├─springmvc-servlet.xml
│ └─web.xml
└─test
└─java

Java Web项目常用Maven依赖

Spring MVC Maven依赖

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!-- Spring MVC依赖 -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aop</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-expression</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>5.1.7.RELEASE</version>
</dependency>
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.2</version>
</dependency>
<!-- Spring MVC依赖结束 -->

JSTL Maven依赖

1
2
3
4
5
6
7
<!-- JSTL依赖 开始 -->
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<!-- JSTL依赖 结束 -->

jackson Maven依赖

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!-- jackson依赖开始 -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.8</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>2.9.8</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-annotations</artifactId>
<version>2.9.8</version>
</dependency>
<!-- jackson依赖结束 -->

Fastjson Maven依赖

1
2
3
4
5
6
7
<!-- Fastjson 依赖 开始 -->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.58</version>
</dependency>
<!-- Fastjson 依赖 结束 -->

MyBatis Maven依赖

1
2
3
4
5
6
7
<!-- MyBatis 依赖 开始 -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.4.6</version>
</dependency>
<!-- MyBatis 依赖 结束 -->

mysql驱动 Maven依赖

1
2
3
4
5
6
7
<!-- mysql 依赖 开始 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.47</version>
</dependency>
<!-- mysql 依赖 结束 -->

注解格式化

第一个按钮选择最后一个,

1
Wrap all elements, except first element if not necessary

第二个选项选中,有阴影表示选中.
第三个选项选第二个:

1
Indent by one

这个缩进小一点.如下图所示:
这里有一张图片
格式化效果如下图所示:
这里有一张图片

实例代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>javascript audio 播放 暂停 重播Demo</title>
</head>
<body>
<audio src="http://audio.xmcdn.com/group58/M07/C0/DC/wKgLglzBws3ydc59AAQFZSpj3Eo398.m4a" controls="controls" preload id="music1"
hidden></audio>
<input type="button" value="播放" id=play_stop onclick="playOrPause();">
<input type="button" value="重播" id="replay" onclick="replay();">
<script>
//重新播放
function replay() {
var audio = document.getElementById('music1');
audio.currentTime = 0;
//不管是否播放或者暂停都直接播放
audio.play();
}
//播放或者暂停
function playOrPause() {
var audio = document.getElementById('music1');
var play_stop=document.getElementById('play_stop');
if (audio !== null) {
//检测播放是否已暂停
//audio.paused在播放器播放时返回false.
//如果已经暂停了,那就播放
if (audio.paused) {
play_stop.value="暂停";
//这个就是播放
audio.play();
} else {
//如果已经播放了,那就暂停
play_stop.value="播放";
audio.pause();// 这个就是暂停
}
}
}
</script>
</body>
</html>

压缩的代码

1
2
3
4
5
<audio src="http://audio.xmcdn.com/group58/M07/C0/DC/wKgLglzBws3ydc59AAQFZSpj3Eo398.m4a" controls="controls" preload id="m" hidden></audio><input type="button" value="播放" id=p_s onclick="ps();"><input type="button" value="重播" id="rp" onclick="rp();">
<script>
function rp(){var a = document.getElementById('m'); a.currentTime = 0; a.play();}
function ps() {var a = document.getElementById('m');var p_s=document.getElementById('p_s');if (a !== null) {if (a.paused) {p_s.value="暂停";a.play();} else {p_s.value="播放";a.pause();}}}
</script>

运行效果

参考资料

https://www.cnblogs.com/kingplus/p/5587441.html

显示目录树命令 tree

帮助文档

1
2
3
4
5
E:\workspace>tree /?
以图形显示驱动器或路径的文件夹结构。
TREE [drive:][path] [/F] [/A]
/F 显示每个文件夹中文件的名称。
/A 使用 ASCII 字符,而不使用扩展字符。

只显示目录不显示文件 不带参数

1
tree MarkdownTools

显示效果:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
卷 固态 的文件夹 PATH 列表
卷序列号为 0DBF-1035
E:\WORKSPACE\MARKDOWNTOOLS
├─.settings
├─bin
│ ├─add
│ ├─delete
│ ├─mainclass
│ └─markdown
│ ├─code
│ ├─formmat
│ └─table
├─lib
├─runable
└─src
├─add
├─delete
├─mainclass
└─markdown
├─code
├─formmat
└─table

显示文件 参数/f

显示一个项目的目录树:

1
tree /f MarkdownTools

显示效果如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
卷 固态 的文件夹 PATH 列表
卷序列号为 00000173 0DBF:1035
E:\WORKSPACE\MARKDOWNTOOLS
fabu.bat
README.md
showpath.bat
UpdateLocalRepertory.bat
├─lib
CodeFormat.jar
SysClipboardUtil.jar
SysClipboardUtil.zip

├─runable
install.bat
M.bat
M.jar
uninstall.bat

└─src
├─add
Add.java

├─delete
Delete.java

├─mainclass
MMD.java

└─markdown
├─code
MDCodeBlock.java

├─formmat
Formmat2Markdown.java

└─table
MDTable.java

参数/a

/a参数会,使用ASCII字符来显示目录树

1
tree /f /a MarkdownTools

运行结果:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
卷 固态 的文件夹 PATH 列表
卷序列号为 0DBF-1035
E:\WORKSPACE\MARKDOWNTOOLS
| .classpath
| .gitignore
| .project
| fabu.bat
| README.md
| showpath.bat
| UpdateLocalRepertory.bat
|
+---.settings
| org.eclipse.core.resources.prefs
| org.eclipse.jdt.core.prefs
|
+---bin
| +---add
| | Add.class
| |
| +---delete
| | Delete.class
| |
| +---mainclass
| | MMD.class
| |
| \---markdown
| +---code
| | MDCodeBlock.class
| |
| +---formmat
| | Formmat2Markdown.class
| |
| \---table
| MDTable.class
|
+---lib
| CodeFormat.jar
| SysClipboardUtil.jar
| SysClipboardUtil.zip
|
+---runable
| install.bat
| M.bat
| M.jar
| uninstall.bat
|
\---src
+---add
| Add.java
|
+---delete
| Delete.java
|
+---mainclass
| MMD.java
|
\---markdown
+---code
| MDCodeBlock.java
|
+---formmat
| Formmat2Markdown.java
|
\---table
MDTable.java

不要使用/a参数好

对于同一个命令,tree /f MarkdownTools命令占了37行,tree /f /a MarkdownTools命令占了65行,所以,还是不要使用/a参数好,因为这样能剩下好多行.

把目录树写入剪贴板

使用上述命令加上,管道符即可,也就是如下形式:

1
tree /f /a MarkdownTools|clip

clip表示系统剪贴板,管道符|表示把前一个命令的输出作为第二个命令的输入.

使用的软件版本

  • eclipse for Java EE 2019
  • jdk 1.8
  • Tomacat 8.5
  • Maven 3.5.4

Maven安装

下载

解压

配置环境变量

M2_HOME环境变量

path环境变量

集成到Eclipse

Eclipse创建Maven Web项目并运行

创建Maven Web项目

Eclipse显示项目的Package Explorer的空白处点击鼠标右键,然后依次选择:New-Other...

这里有一张图片

在弹出的New窗口中,展开Maven,选择Maven Project,然后点击Next

这里有一张图片

然后默认,点击Next

这里有一张图片

往下拖动滚动条到最后,选择maven-archetype-webapp,点击Next

这里有一张图片

如果找不到,可以选择Internal,然后拖动到滚动条到最后,选择maven-archetype-webapp,点击Next

image-20210831165051568

填入坐标,Group IdArtifact Id,剩下的随意,最后点击Finish即可

这里有一张图片

这样就创建好了一个MavenWeb项目,这个项目会报错,如下图所示,这是因为还没有引入Tomcat的库导致的.

这里有一张图片

修改项目配置

把Maven Web项目改为Java Web项目

在项目上点击右键,选择Properties

这里有一张图片

选择JDK版本

展开Maven,选择Proiect Facets,取消勾选Dynamic Web Module,然后把Java的版本改为1.8,然后点击Apply

这里有一张图片

重新选择Dynamic Web Module版本

接着把Dynamic Web Module的版本改为3.1,然后勾选上Dynamic Web Module,这个时候下面会弹出这个链接Further configuration available....:

指定Web应用根目录

这里有一张图片

点击这个连接,然后勾选上Generate web. xml deployment descriptor,点击OK

这里有一张图片

image-20210831165704903

选择Tomcat

然后点击右边的Runtimes勾选上对应的Tomcat,最后点击Apply and Close即可。
这里有一张图片

创建java目录

src下面的main目录下创建一个java目录,我们后面的java代码会放在这里

这里有一张图片

效果

此时的项目结构如下图所示:

这里有一张图片

修改web.xml

打开web.xml文件,可以看到默认生成的代码如下:

1
2
3
4
5
6
<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd" >
<web-app>
<display-name>Archetype Created Web Application</display-name>
</web-app>

这个2.3版本太老了。改成3.1版本的。

修改方式1:复制粘贴

全选,然后粘贴如下代码:

1
2
3
4
5
6
7
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
id="WebApp_ID" version="3.1">
<display-name>HelloWorld</display-name>
</web-app>

修改方式2:生成

删除掉web.xml

image-20210831170105661

重新生成

image-20210831170207424

到这里就可启动项目了,看到效果了。

修改pom.xml

junit版本改为4.12.

测试

启动项目Run on Server

image-20210831170538987

浏览器将显示index.jsp页面之中的内容,如下图所示:
这里有一张图片

编写代码

编写HelloWorldServlet

创建包

src/main/java下创建一个hello包,

image-20210831170739596

创建Servlet

在包上面,右键,选择Servlet:

image-20210831170919372

输入Servlet名称HelloWorldServlet

image-20210831171035960

点击next,设置这个Servlet的URL

image-20210831171137384

勾选要实现的方法:

image-20210831171331247

HelloWorldServlet完整代码

修改HelloWorldServlet文件,得到如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
package hello;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
@WebServlet("/HelloWorldServlet")
public class HelloWorldServlet extends HttpServlet
{
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request,
HttpServletResponse response)
throws ServletException,IOException
{
response.setContentType("text/html,charset=utf-8;");
PrintWriter writer = response.getWriter();
writer.println(
"<html><head><title>helloworld</title></head>"
+ "<body><h2>HelloWorld</h2></body>"
+ "</html>");
}
}

浏览器访问

Run On server,然后打开浏览器,在地址上面输入URL:
http://localhost:8080/HelloWorld/HelloWorldServlet
即可访问到该Servlet,显示效果如下:
这里有一张图片

使用Maven一键部署到Tomcat中

上面我们用的是Eclipse部署的,使用Maven可以打包把项目部署成war

设置tomcat用户密码

打开Tomcat安装目录中conf目录下的tomcat-users.xml配置文件,

或者EclipseServer项目中的tomcat-users.xml,在<tomcat-users></tomcat-users>之中添加如下代码:

1
2
3
4
5
<role rolename="admin"/>
<role rolename="manager"/>
<role rolename="manager-gui"/>
<role rolename="manager-script"/>
<user username="admin" password="admin" roles="admin,manager,manager-gui,manager-script"/>
  • role标签表示权限。
  • user标签表示一个后台管理员,user标签的
    • username,password这两个属性分别是该后台管理员的账户密码,
    • roles属性对应上面的role标签.

image-20210901104704380

验证密码

启动Tomcat,然后进入manager

image-20210901104919066

此时会要求你输入密码,输入你上面设置好的密码:

image-20210901105020297

如果能成功进入如下界面,则说明设置Tomcat的密码成功了:

image-20210901105447959

修改Maven的配置文件

打开Maven安装目录下conf目录下的settings.xml配置文件,或者%HOME%\.m2目录下的settings.xml,在
<servers></servers>标签中添加如下代码:

1
2
3
4
5
<server>
<id>tomcatserver</id>
<username>admin</username>
<password>admin</password>
</server>

image-20210901111047787

安装Tomcat Maven部署插件

tomcat7的插件

项目中的pom.xml,在<build></build>标签之中添加如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<project ...>
...
<build>
<finalName>HelloWorld</finalName>
<plugins>
<plugin>
<!-- https://mvnrepository.com/artifact/org.apache.tomcat.maven/tomcat7-maven-plugin -->
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<url>http://localhost:8080/manager/text</url>
<server>tomcatserver</server>
<!-- <path>/HelloWorld</path> -->
<username>admin</username>
<password>admin</password>
</configuration>
</plugin>
</plugins>
</build>
</project>

<plugin>元素详解

  • groupId,artifactId,version为固定内容,这里使用的是tomcat7-maven-plugin,类似的还有tomcat8-maven-plugin和tomcat9-maven-plugin。但是我使用8和9的都部署失败。不知道是什么原因
  • configuration标签的子标签
  • <url>标签。Tomcat8.5的管理界面的url为http://localhost:8080/manager/html,把html该成text就得到url标签的值。至于为什么要改成text,这个我不知道。我为html,时运行失败。
  • <path>标签表示该web项目将部署到在tomcatwebapp下的的/HelloWorld路径中。path可以不指定,如果不指定的,会使用项目名。最好不要指定path,这样便于把这段代码复制到其他项目中,会在webapp中生成该项目的同名目录。而不是继续部署到webapp下的HelloWorld中。
    • 例如这段代码原本写在HelloWorld的pom中,现在复制到Login6SsmMaven的pom中,如果保留path标签,则Login6SsmMaven项目的内容,就会覆盖到HelloWorld,造成HelloWorld原来的内容丢失。并且通过路径/Login6SsmMaven也访问不到Login6SsmMaven,必须通过/HelloWorld来访问Login6SsmMaven项目的内容。
  • <username><password>与上面的Maven的settings.xml配置文件中设置的用户名和密码一样
  • <server>中的tomcatserver和上面的Maven的settings.xml配置文件中设置的id一样。

部署

先运行Tomcat

先运行Tomcat再部署,先运行Tomcat再部署先运行Tomcat再部署

到Tomcat安装目录下的bin目录下,运行startup.bat

1
G:\apache-tomcat-8.5.35-windows-x64\apache-tomcat-8.5.35\bin\startup.bat

如果在Eclipse中启动Tomcat的话,然后再部署,我之前是可以成功部署的。但是今天实测不能部署,所以保险起见还是通过startup.bat来启动Tomcat比较合适。

再使用Maven部署项目

回到Eclipse中,右键项目,

这里有一张图片
输入如下命令:

1
clean install tomcat7:redeploy

这里有一张图片
部署成功控制台输出如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
[INFO] Scanning for projects...
[INFO]
[INFO] ------------------------< com.blue:HelloWorld >-------------------------
[INFO] Building HelloWorld Maven Webapp 0.0.1-SNAPSHOT
[INFO] --------------------------------[ war ]---------------------------------
[INFO]
[INFO] --- maven-clean-plugin:2.5:clean (default-clean) @ HelloWorld ---
[INFO] Deleting E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-resources-plugin:2.6:resources (default-resources) @ HelloWorld ---
[WARNING] Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent!
[INFO] Copying 0 resource
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-compiler-plugin:3.1:compile (default-compile) @ HelloWorld ---
[INFO] Changes detected - recompiling the module!
[WARNING] File encoding has not been set, using platform encoding UTF-8, i.e. build is platform dependent!
[INFO] Compiling 1 source file to E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\classes
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-resources-plugin:2.6:testResources (default-testResources) @ HelloWorld ---
[WARNING] Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent!
[INFO] skip non existing resourceDirectory E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\src\test\resources
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-compiler-plugin:3.1:testCompile (default-testCompile) @ HelloWorld ---
[INFO] Nothing to compile - all classes are up to date
[INFO]
[INFO] --- maven-surefire-plugin:2.12.4:test (default-test) @ HelloWorld ---
[INFO] No tests to run.
[INFO]
[INFO] --- maven-war-plugin:2.2:war (default-war) @ HelloWorld ---
[INFO] Packaging webapp
[INFO] Assembling webapp [HelloWorld] in [E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\HelloWorld]
[INFO] Processing war project
[INFO] Copying webapp resources [E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\src\main\webapp]
[INFO] Webapp assembled in [53 msecs]
[INFO] Building war: E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\HelloWorld.war
[INFO] WEB-INF\web.xml already added, skipping
[INFO]
[INFO] --- maven-install-plugin:2.4:install (default-install) @ HelloWorld ---
[INFO] Installing E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\HelloWorld.war to G:\dev2\maven_my\libs\com\blue\HelloWorld\0.0.1-SNAPSHOT\HelloWorld-0.0.1-SNAPSHOT.war
[INFO] Installing E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\pom.xml to G:\dev2\maven_my\libs\com\blue\HelloWorld\0.0.1-SNAPSHOT\HelloWorld-0.0.1-SNAPSHOT.pom
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] >>> tomcat7-maven-plugin:2.2:redeploy (default-cli) > package @ HelloWorld >>>
[INFO]
[INFO] --- maven-resources-plugin:2.6:resources (default-resources) @ HelloWorld ---
[WARNING] Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent!
[INFO] Copying 0 resource
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-compiler-plugin:3.1:compile (default-compile) @ HelloWorld ---
[INFO] Nothing to compile - all classes are up to date
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-resources-plugin:2.6:testResources (default-testResources) @ HelloWorld ---
[WARNING] Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent!
[INFO] skip non existing resourceDirectory E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\src\test\resources
[INFO] >> 阿里云Maven中央仓库为阿里云云效提供的公共代理仓库
[INFO] >> 云效也提供了免费、可靠的Maven私有仓库Packages,欢迎您体验使用
[INFO] >> https://packages.aliyun.com?channel=pd_maven_download
[INFO]
[INFO] --- maven-compiler-plugin:3.1:testCompile (default-testCompile) @ HelloWorld ---
[INFO] Nothing to compile - all classes are up to date
[INFO]
[INFO] --- maven-surefire-plugin:2.12.4:test (default-test) @ HelloWorld ---
[INFO] No tests to run.
[INFO] Skipping execution of surefire because it has already been run for this configuration
[INFO]
[INFO] --- maven-war-plugin:2.2:war (default-war) @ HelloWorld ---
[INFO] Packaging webapp
[INFO] Assembling webapp [HelloWorld] in [E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\HelloWorld]
[INFO] Processing war project
[INFO] Copying webapp resources [E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\src\main\webapp]
[INFO] Webapp assembled in [8 msecs]
[INFO] Building war: E:\dev2\workspacne_JDK8Tomcat8.5\HelloWorld\target\HelloWorld.war
[INFO] WEB-INF\web.xml already added, skipping
[INFO]
[INFO] <<< tomcat7-maven-plugin:2.2:redeploy (default-cli) < package @ HelloWorld <<<
[INFO]
[INFO]
[INFO] --- tomcat7-maven-plugin:2.2:redeploy (default-cli) @ HelloWorld ---
[INFO] Deploying war to http://localhost:8080/HelloWorld
Uploading: http://localhost:8080/manager/text/deploy?path=%2FHelloWorld&update=true
Uploaded: http://localhost:8080/manager/text/deploy?path=%2FHelloWorld&update=true (4 KB at 3268.6 KB/sec)

[INFO] tomcatManager status code:200, ReasonPhrase:
[INFO] OK - Deployed application at context path [/HelloWorld]
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 4.402 s
[INFO] Finished at: 2021-09-01T11:33:16+08:00
[INFO] ------------------------------------------------------------------------

看到BUILD SUCCESS这句话就表示部署成功了:

1
2
3
4
5
6
7
8
9
10
11
12
[INFO] Deploying war to http://localhost:8080/HelloWorld  
Uploading: http://localhost:8080/manager/text/deploy?path=%2FHelloWorld&update=true
Uploaded: http://localhost:8080/manager/text/deploy?path=%2FHelloWorld&update=true (4 KB at 3268.6 KB/sec)

[INFO] tomcatManager status code:200, ReasonPhrase:
[INFO] OK - Deployed application at context path [/HelloWorld]
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 4.402 s
[INFO] Finished at: 2021-09-01T11:33:16+08:00
[INFO] ------------------------------------------------------------------------

Deploying war to http://127.0.0.1:8080/HelloWorld
这句话表示部署到了
http://127.0.0.1:8080/HelloWorld
这个URL上.打开这个URL即可看到效果:
这里有一张图片

1
2
3
4
5
6
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>4.0.0</version>
<scope>provided</scope>
</dependency>

Tomcat之中部署的效果

打开tomcatwebapps目录可以看到Maven部署的war包:
这里有一张图片

参考资料

https://blog.csdn.net/ai_lian_shuo/article/details/77096071#t11

https://www.linuxidc.com/Linux/2017-05/143308.htm

JSTL 库安装

Apache Tomcat安装JSTL 库步骤如下:

下载JSTL库

从Apache的标准标签库中下载的二进包(jakarta-taglibs-standard-current.zip)。
官方下载地址:http://archive.apache.org/dist/jakarta/taglibs/standard/binaries/
本站下载地址:jakarta-taglibs-standard-1.1.2.zip

复制jar文件到项目中

下载jakarta-taglibs-standard-1.1.2.zip包并解压,将jakarta-taglibs-standard-1.1.2/lib/下的两个jar文件:standard.jarjstl.jar文件拷贝到/WEB-INF/lib/下。

复制tld文件到项目中

jakarta-taglibs-standard-1.1.2/tld/目录下的需要引入的tld文件复制到WEB-INF/tld/目录下,

在JSP页面引入

接下来我们在 web.xml 文件中添加以下配置: