<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>boot-01首页</title> </head> <body> <h1>工程首页</h1> <!--相对路径--> <a href="bmi.html">BMI测试</a> <a href="/bmi.html">BMI测试</a> <!--绝对路径 http://localhost:8080/--> </body> </html>
时间: 2023-07-28 08:11:06 浏览: 68
这是一个简单的HTML页面,其中包含了两个链接。第一个链接是相对路径的示例,它指向名为"bmi.html"的文件。第二个链接是绝对路径的示例,它指向根目录下的"bmi.html"文件。
相对路径是相对于当前文件所在位置的路径,而绝对路径是从根目录开始的完整路径。在这个例子中,假设您正在访问的页面位于"http://localhost:8080/",那么第一个链接将指向"http://localhost:8080/bmi.html",而第二个链接将指向"http://localhost:8080/bmi.html"。
请注意,这只是一个静态HTML页面的示例,其中包含了两个简单的链接。在实际的应用程序中,链接可能会指向更复杂的页面或功能。
相关问题
spring-boot-starter-websocket入门demo
好的,下面是一个简单的 Spring Boot WebSocket 入门 demo:
1. 首先,在 pom.xml 文件中引入 `spring-boot-starter-websocket` 依赖:
```xml
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
```
2. 创建一个简单的 WebSocket 处理器:
```java
@Component
public class WebSocketHandler extends TextWebSocketHandler {
private final List<WebSocketSession> sessions = new CopyOnWriteArrayList<>();
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
sessions.add(session);
session.sendMessage(new TextMessage("连接成功!"));
}
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
for (WebSocketSession webSocketSession : sessions) {
webSocketSession.sendMessage(new TextMessage("客户端说:" + message.getPayload()));
}
}
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
sessions.remove(session);
}
}
```
3. 创建 WebSocket 配置类:
```java
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
@Autowired
private WebSocketHandler webSocketHandler;
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(webSocketHandler, "/ws").setAllowedOrigins("*");
}
}
```
4. 编写一个简单的页面来测试 WebSocket:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WebSocket</title>
</head>
<body>
<h1>WebSocket Demo</h1>
<div>
<input type="text" id="input"/>
<button onclick="send()">发送</button>
</div>
<div id="output"></div>
<script>
var socket = new WebSocket("ws://localhost:8080/ws");
socket.onmessage = function(event) {
var output = document.getElementById("output");
output.innerHTML += "<p>" + event.data + "</p>";
};
function send() {
var input = document.getElementById("input");
socket.send(input.value);
input.value = "";
}
</script>
</body>
</html>
```
5. 运行程序,访问 http://localhost:8080/index.html,打开浏览器控制台,输入命令 `socket.send("Hello, WebSocket!")`,即可看到页面上显示出 "客户端说:Hello, WebSocket!"。
希望这个 demo 能帮助到你。
springMVC项目如何整合thymeleaf和element-ui
整合Thymeleaf和Element-UI,需要在SpringMVC项目中配置Thymeleaf模板引擎和Element-UI前端框架。
首先,在Spring MVC项目中引入Thymeleaf和Element-UI的依赖。可以在pom.xml文件中添加以下依赖:
```xml
<dependencies>
<!-- Thymeleaf -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!-- Element-UI -->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator-core</artifactId>
<version>0.40</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>element-ui</artifactId>
<version>2.10.1</version>
</dependency>
</dependencies>
```
然后,在Spring MVC配置文件中配置Thymeleaf模板引擎。可以在application.properties或application.yml文件中添加以下配置:
```properties
# Thymeleaf
spring.thymeleaf.mode=HTML
spring.thymeleaf.cache=false
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.servlet.content-type=text/html;charset=UTF-8
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.template-resolver-order=1
spring.thymeleaf.view-names=*
spring.thymeleaf.check-template-location=true
```
最后,在Thymeleaf模板中使用Element-UI的组件。可以在HTML文件中添加以下代码:
```html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:t="http://www.thymeleaf.org/extras/thymeleaf-spring4"
xmlns:el="http://www.thymeleaf.org/extras/element-ui"
lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- Element-UI -->
<link rel="stylesheet" href="/webjars/element-ui/2.10.1/theme-chalk/index.css">
<script src="/webjars/element-ui/2.10.1/index.js"></script>
</head>
<body>
<!-- 使用Element-UI的组件 -->
<el-button>Button</el-button>
</body>
</html>
```
以上就是整合Thymeleaf和Element-UI的步骤,希望能对你有所帮助!