备案控制台
开发者社区 数据库 文章 正文

SpringBoot-----从前端更新数据到MySql数据库

2024-05-15 32
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
本文涉及的产品
RDS MySQL Serverless 基础系列，0.5-2RCU 50GB
推荐场景：
学生管理系统数据库设计 搭建个人博客
RDS MySQL Serverless 高可用系列，价值2615元额度，1个月
简介： SpringBoot-----从前端更新数据到MySql数据库

参考SpringBoot官网教程：

1.Validating Form Input

2.Handling Form Submission

3.Accessing data with MySQL

（一）连接MySql

在pom.xml中引入以下依赖：

---------连接数据库----------    
<dependency>
  <groupId>mysql</groupId>
  <artifactId>mysql-connector-java</artifactId>
  <version>8.0.12</version>
</dependency>
 
 
-------用于启用JPA和Hibernate,实现数据的持久化-------
  <dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-data-jpa</artifactId>
  </dependency>
 
 
-----------启用web应用程序----------
  <dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
  </dependency>
 
 
--------用于构建交互的WEB应用程序-------
  <dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
  </dependency>
 
 
-------启用校验功能----------
  <dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-validation</artifactId>
    <version>3.1.5</version>
  </dependency>

在application.properties中添加如下代码，连接数据库

spring.jpa.hibernate.ddl-auto=update
spring.datasource.url=jdbc:mysql://localhost:3306/db_example?useSSL=false&serverTimezone=GMT%2B8&useUnicode=true&characterEncoding=UTF-8
spring.datasource.username=root
spring.datasource.password=123456ab
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
#spring.jpa.show-sql: true
# spring.thymeleaf.cache=false
# spring.thymeleaf.prefix=classpath:/templates/
# spring.thymeleaf.suffix=.html

也可以添加application.yml：

application.yml 的功能和 application.properties 是一样的，不过因为yml文件是树状结构，写起来有更好的层次感，更易于理解，所以很多人都选择了yml文件。

spring:
    datasource:
        driver-class-name: com.mysql.jdbc.Driver
        url: jdbc:mysql://localhost:3306/springboot?useUnicode=true&characterEncoding=utf-8&useSSL=false
        username: root
        password: 123456ab
（二）创建实体模型

@Entity注解用于将一个类标识为 JPA 实体，它告诉 Hibernate 或其他 JPA 实现框架将这个类映射为数据库中的表

注：想深入学习校验方法及注释的小伙伴可以看看这个：

package com.example.accessingdatamysql;
 
import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;
import jakarta.persistence.SequenceGenerator;
import jakarta.validation.constraints.NotEmpty;
import jakarta.validation.constraints.Email;
import jakarta.validation.constraints.NotNull;
import jakarta.validation.constraints.Size;
 
@Entity // This tells Hibernate to make a table out of this class
public class User {
  @Id
//指定序列生成器，序列生成器的名称为"user_seq"
  @GeneratedValue(strategy = GenerationType.SEQUENCE, generator = "user_seq")
//每次增长值为1
  @SequenceGenerator(name = "user_seq", sequenceName = "user_seq", allocationSize = 1)
  private Integer id;
 
  @NotNull(message = "姓名不能为空")
  @Size(min = 2, max = 30, message = "姓名长度必须在2-30之间")
  private String name;
 
  @Email
  @NotEmpty(message = "邮箱不能为空")
  private String email;
 
  public Integer getId() {
    return id;
  }
 
  public void setId(Integer id) {
    this.id = id;
  }
 
  public String getName() {
    return name;
  }
 
  public void setName(String name) {
    this.name = name;
  }
 
  public String getEmail() {
    return email;
  }
 
  public void setEmail(String email) {
    this.email = email;
  }
 
  public String toString() {
    return "User(id:" + this.id + ",name:" + this.name + ",email:" + this.email + ")";
  }
}
（三）创建Repository接口

Repository接口，用于定义数据访问的方法

package com.example.accessingdatamysql;
 
import org.springframework.data.repository.CrudRepository;
 
// import com.example.accessingdatamysql.User;
 
// This will be AUTO IMPLEMENTED by Spring into a Bean called userRepository
// CRUD refers Create, Read, Update, Delete
 
//使用Iterable，可以根据条件来查询匹配的用户，并获取到一个包含所有符合条件的迭代的用户列表。
public interface UserRepository extends CrudRepository<User, Integer> {
 
//根据姓名查询用户
    Iterable<User> findByName(String name);
 
//根据邮箱查询用户
    Iterable<User> findByEmail(String email);
 
//根据邮箱和姓名查询用户
    Iterable<User> findByNameAndEmail(String email,String name);
 
}
（四）创建Controller类

Controller类通常用于Web应用程序，它接收用户的HTTP请求，调用业务逻辑处理请求，并返回一个包含响应数据的视图。

package com.example.accessingdatamysql;
 
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.validation.annotation.Validated;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
 
import jakarta.validation.Valid;
 
@Controller
@Validated
public class WebController implements WebMvcConfigurer {
    @Autowired
    private UserRepository userRepository;
 
    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/results").setViewName("results");
    }
 
    @GetMapping("/form")
    public String showForm(Model model) {
        model.addAttribute("user", new User());
        return "form";
    }
 
    @PostMapping("/")
    public String submintForm(@Valid @ModelAttribute("user") User user, BindingResult bindingResult) {
        if (bindingResult.hasErrors()) {
            return "form";
        }
        userRepository.save(user);
        return "redirect:/list";
    }
 
    @GetMapping("/list")
    public String showList(Model model) {
        model.addAttribute("userList", userRepository.findAll());
        return "list";
    }
 
    @GetMapping(path = "/deleteAll")
    public String deleteAllUsers(Model model) {
        userRepository.deleteAll();
        Iterable<User> userList = userRepository.findAll();
        model.addAttribute("userList", userList);
        return "redirect:/list";
    }
 
    @GetMapping(path = "/delete/{id}")
    public String deleteUser(@PathVariable("id") Integer id, Model model) {
        userRepository.deleteById(id);
        Iterable<User> userList = userRepository.findAll();
        model.addAttribute("userList", userList);
        return "redirect:/list"; // 返回list.html模板
    }
 
    @GetMapping(path = "/edit/{id}")
    public String updateUser(@PathVariable("id") Integer id, Model model) {
        User user = userRepository.findById(id).orElseThrow(() -> new IllegalArgumentException("Invalid user ID"));
        model.addAttribute("user", user);
        return "edit";
    }
 
    @PostMapping(path = "/update")
    public String update(@Valid User user, Model model) {
        userRepository.save(user);
        Iterable<User> userList = userRepository.findAll();
        model.addAttribute("userList", userList);
        return "list";
    }
 
    @GetMapping("/find")
    public String findUserByNameAndEmail(@RequestParam("name") String name,
            @RequestParam("email") String email, Model model) {
        Iterable<User> userlist;
 
        if (!name.isEmpty() && !email.isEmpty()) {
            // 根据姓名和邮箱查询用户
            userlist = userRepository.findByNameAndEmail(name, email);
        } else if (!name.isEmpty()) {
            // 根据姓名查询用户
            userlist = userRepository.findByName(name);
        } else if (!email.isEmpty()) {
            // 根据邮箱查询用户
            userlist = userRepository.findByEmail(email);
        } else {
            // 返回所有用户
            userlist = userRepository.findAll();
        }
        model.addAttribute("userlist", userlist);
        return "check";
    }
}

这里的注释

@Valid：用于验证注释是否符合要求，例如

这里就是检验密码是否为空

@RestController
@RequestMapping("/user")
public class UserController {
    @PostMapping
    public User create (@Valid @RequestBody User user) {
        System.out.println(user.getId());
        System.out.println(user.getUsername());
        System.out.println(user.getPassword());
        user.setId("1");
        return user;
    }
}    
 
public class User {
    private String id;  
 
    @NotBlank(message = "密码不能为空")
    private String password;
}

@RequestParam：将请求参数绑定到你控制器的方法参数上（是springmvc中接收普通参数的注解）

//url参数中的name必须要和@RequestParam("name")一致
    @RequestMapping("show16")
    public ModelAndView test16(@RequestParam("name")String name){
        ModelAndView mv = new ModelAndView();
        mv.setViewName("hello");
        mv.addObject("msg", "接收普通的请求参数：" + name);
        return mv;
    }

得到结果

url:localhost:8080/hello/show16?name=cc

页面：

接收普通的请求参数：cc

(五)运行AccessingDataMysqlApplication
package com.example.accessingdatamysql;
 
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
 
@SpringBootApplication
public class AccessingDataMysqlApplication {
 
  public static void main(String[] args) {
    SpringApplication.run(AccessingDataMysqlApplication.class, args);
  }
}
（六）HTML页面设置

check.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
 
<head>
    <meta charset="UTF-8">
    <title>Check User List</title>
    <style>
        body {
            display: flex;
            align-items: stretch;
            height: 100vh;
            background-color: #f2f2f2;
            justify-content: space-between;
            flex-wrap: wrap;
            flex-direction: column;
            align-content: center;
        }
 
        table {
            width: 600px;
            margin-top: 20px;
            border-collapse: collapse;
            background-color: #fff;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
 
        table th,
        table td {
            padding: 10px;
            text-align: center;
            border: 1px solid #ccc;
        }
 
        table th {
            background-color: #f2f2f2;
        }
 
        a {
            display: block;
            text-align: center;
            margin-top: 20px;
            text-decoration: none;
            color: #4CAF50;
            font-weight: bold;
        }
 
        a:hover {
            color: #45a049;
        }
 
        .btn-edit,
        .btn-delete {
            display: inline-block;
            padding: 5px 10px;
            border: none;
            background-color: #4CAF50;
            color: white;
            text-decoration: none;
            cursor: pointer;
        }
 
        .btn-edit:hover,
        .btn-delete:hover {
            background-color: #45a049;
        }
    </style>
</head>
 
<body>
    <h1 style="text-align: center; margin-bottom: 20px;">Check User List</h1>
    <form th:action="@{/find}" method="get" style="text-align: center;">
        <input type="text" name="name" placeholder="姓名">
        <input type="text" name="email" placeholder="邮箱">
        <button type="submit">查询</button>
    </form>
    <table>
        <tr>
            <th>Name</th>
            <th>Email</th>
            <th>操作</th>
        </tr>
        <tr th:each="user : ${userlist}">
            <td th:text="${user.name}"></td>
            <td th:text="${user.email}"></td>
            <td>
                <a th:href="@{'/edit/' + ${user.id}}" class="btn-edit">编辑</a>
                <a th:href="@{'/delete/' + ${user.id}}" class="btn-delete">删除</a>
            </td>
        </tr>
    </table>
    <a href="/form" style="text-align: center; margin-top: 20px; display: block;">添加新信息</a>
</body>
 
</html>

edit.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
 
<head>
    <meta charset="UTF-8">
    <title>Edit User</title>
    <style>
        body {
            display: flex;
            align-items: center;
            height: 100vh;
            background-color: #f2f2f2;
            flex-direction: column;
            flex-wrap: wrap;
            align-content: center;
            justify-content: center;
        }
 
        form {
            width: 400px;
            padding: 20px;
            background-color: #fff;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            text-align: center;
        }
 
        label {
            display: block;
            margin-bottom: 10px;
            font-weight: bold;
        }
 
        input {
            width: 100%;
            padding: 8px;
            margin-bottom: 20px;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-sizing: border-box;
        }
 
        button {
            padding: 10px 20px;
            border: none;
            background-color: #4CAF50;
            color: white;
            text-decoration: none;
            cursor: pointer;
        }
 
        button:hover {
            background-color: #45a049;
        }
 
        a {
            display: block;
            margin-top: 20px;
            text-align: center;
            text-decoration: none;
            color: #4CAF50;
            font-weight: bold;
        }
 
        a:hover {
            color: #45a049;
        }
    </style>
</head>
 
<body>
    <h1>编辑信息</h1>
 
    <form th:action="@{/update}" method="post">
        <input type="hidden" th:name="id" th:value="${id}" />
 
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" th:value="${name}" />
 
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" th:value="${email}" />
 
        <button type="submit">保存</button>
    </form>
 
    <a href="/list">返回列表</a>
</body>
 
</html>

form.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
 
<head>
    <meta charset="UTF-8">
    <title>Form</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f2f2f2;
        }
 
        .form-container {
            width: 400px;
            padding: 20px;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
 
        .form-container h1 {
            text-align: center;
            margin-bottom: 20px;
        }
 
        .form-container label {
            display: block;
            margin-bottom: 10px;
        }
 
        .form-container input[type="text"],
        .form-container input[type="email"] {
            width: 100%;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
 
        .form-container button[type="submit"] {
            display: block;
            width: 100%;
            padding: 10px;
            margin-top: 20px;
            background-color: #4CAF50;
            color: #fff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
 
        .form-container button[type="submit"]:hover {
            background-color: #45a049;
        }
 
        .form-container button[type="reset"] {
            display: block;
            width: 100%;
            padding: 10px;
            margin-top: 20px;
            background-color: #4CAF50;
            color: #fff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
 
        .form-container button[type="reset"]:hover {
            background-color: #45a049;
        }
 
        .form-container button[type="delete"] {
            display: block;
            width: 100%;
            padding: 10px;
            margin-top: 20px;
            background-color: #4CAF50;
            color: #fff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
 
        .form-container button[type="delete"]:hover {
            background-color: #45a049;
        }
 
        .form-container span {
            color: red;
            font-size: 12px;
            margin-top: 5px;
        }
    </style>
</head>
 
 
<body>
    <div class="form-container">
        <h1>表格</h1>
        <form action="#" th:action="@{/}" th:object="${user}" method="post">
            <div>
                <label for="name">Name:</label>
                <input type="text" id="name" th:field="*{name}" required>
                <span th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</span>
            </div>
            <div>
                <label for="email">Email:</label>
                <input type="text" id="email" th:field="*{email}" required>
                <span th:if="${#fields.hasErrors('email')}" th:errors="*{email}">Email Error</span>
            </div>
            <div>
                <button type="submit">Submit</button>
                <button type="reset">Reset</button>
                <button type="delete">Delete</button>
            </div>
        </form>
    </div>
</body>
 
</html>

list.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
 
<head>
    <meta charset="UTF-8">
    <title>List</title>
    <style>
        body {
            display: flex;
            align-items: stretch;
            height: 100vh;
            background-color: #f2f2f2;
            justify-content: space-between;
            flex-wrap: wrap;
            flex-direction: column;
            align-content: center;
        }
 
        table {
            width: 600px;
            margin-top: 20px;
            border-collapse: collapse;
            background-color: #fff;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
 
        table th,
        table td {
            padding: 10px;
            text-align: center;
            border: 1px solid #ccc;
        }
 
        table th {
            background-color: #f2f2f2;
        }
 
        a {
            display: block;
            text-align: center;
            margin-top: 20px;
            text-decoration: none;
            color: #4CAF50;
            font-weight: bold;
        }
 
        a:hover {
            color: #45a049;
        }
 
        .btn-edit,
        .btn-delete {
            display: inline-block;
            padding: 5px 10px;
            border: none;
            background-color: #4CAF50;
            color: white;
            text-decoration: none;
            cursor: pointer;
        }
 
        .btn-edit:hover,
        .btn-delete:hover {
            background-color: #45a049;
        }
 
        .btn-delete-all {
            display: block;
            text-align: center;
            margin-top: 20px;
            text-decoration: none;
            color: #f44336;
            font-weight: bold;
        }
 
        .btn-delete-all:hover {
            color: #d32f2f;
        }
    </style>
</head>
 
<body>
    <h1 style="text-align: center; margin-bottom: 20px;">信息系统</h1>
    <form th:action="@{/find}" method="get" style="text-align: center;">
        <input type="text" name="name" placeholder="姓名">
        <input type="text" name="email" placeholder="邮箱">
        <button type="submit">查询</button>
    </form>
    <table>
        <tr>
            <th>Name</th>
            <th>Email</th>
            <th>操作</th>
        </tr>
        <tr th:each="user : ${userList}">
            <td th:text="${user.name}"></td>
            <td th:text="${user.email}"></td>
            <td>
                <a th:href="@{'/edit/' + ${user.id}}" class="btn-edit">编辑</a>
                <a th:href="@{'/delete/' + ${user.id}}" class="btn-delete">删除</a>
            </td>
        </tr>
    </table>
    <a href="/form" style="text-align: center; margin-top: 20px; display: block;">添加新信息</a>
    <a href="/deleteAll" class="btn-delete-all">删除全部用户信息</a>
</body>
 
</html>
文章标签：
云数据库 RDS MySQL 版
关系型数据库
MySQL
数据库
前端开发
Java
关键词：
Spring Boot数据库
Spring Boot数据
前端数据
前端数据库
前端springboot
相关实践学习
基于CentOS快速搭建LAMP环境
本教程介绍如何搭建LAMP环境，其中LAMP分别代表Linux、Apache、MySQL和PHP。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心，利用清洁计算为万物互联的新世界提供源源不断的能源动力，目前开服的区域包括中国（华北、华东、华南、香港）、新加坡、美国（美东、美西）、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程，来了解阿里云能够为你的业务带来哪些帮助 &nbsp; &nbsp; 相关的阿里云产品：云服务器ECS 云服务器 ECS（Elastic Compute Service）是一种弹性可伸缩的计算服务，助您降低 IT 成本，提升运维效率，使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
dulu~dulu
目录
相关文章
以山向海
|
4天前
|
SQL 缓存 关系型数据库
关系型数据mysql配置参数和默认设置
【6月更文挑战第14天】
以山向海
25 6
以山向海
|
3天前
|
存储 关系型数据库 MySQL
关系型数据库mysql数据文件存储
【6月更文挑战第15天】
以山向海
10 4
花开富贵111
|
21小时前
|
分布式计算 大数据 关系型数据库
MaxCompute产品使用问题之如何查看数据离线同步每天从MySQL抽取的数据量
MaxCompute作为一款全面的大数据处理平台，广泛应用于各类大数据分析、数据挖掘、BI及机器学习场景。掌握其核心功能、熟练操作流程、遵循最佳实践，可以帮助用户高效、安全地管理和利用海量数据。以下是一个关于MaxCompute产品使用的合集，涵盖了其核心功能、应用场景、操作流程以及最佳实践等内容。
花开富贵111
16 7
半夜敲代码的夜猫子
|
5天前
|
NoSQL Java 数据库
SpringBoot实用开发篇第三章（数据层解决方案操作）
SpringBoot实用开发篇第三章（数据层解决方案操作）
半夜敲代码的夜猫子
41 6
小蜗牛耶
|
3天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue的数据库课程在线教学的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue的数据库课程在线教学的详细设计和实现(源码+lw+部署文档+讲解等)
小蜗牛耶
16 2
蓝易云
|
3天前
|
canal 关系型数据库 MySQL
蓝易云 - 详解canal同步MySQL增量数据到ES
以上就是使用Canal同步MySQL增量数据到Elasticsearch的基本步骤。在实际操作中，可能还需要根据具体的业务需求和环境进行一些额外的配置和优化。
蓝易云
20 2
青欢
|
4天前
|
Java 数据库连接 数据库
实现Spring Boot与MyBatis结合进行数据库历史数据的定时迁移
实现Spring Boot与MyBatis结合进行数据库历史数据的定时迁移
青欢
14 2
陈佳烨
|
5天前
|
easyexcel Java API
SpringBoot集成EasyExcel 3.x：高效实现Excel数据的优雅导入与导出
SpringBoot集成EasyExcel 3.x：高效实现Excel数据的优雅导入与导出
陈佳烨
17 1
花开富贵111
|
7天前
|
消息中间件 关系型数据库 MySQL
实时计算 Flink版操作报错合集之同步MySQL数据并EP（复杂事件处理）时，编译报错，如何解决
在使用实时计算Flink版过程中，可能会遇到各种错误，了解这些错误的原因及解决方法对于高效排错至关重要。针对具体问题，查看Flink的日志是关键，它们通常会提供更详细的错误信息和堆栈跟踪，有助于定位问题。此外，Flink社区文档和官方论坛也是寻求帮助的好去处。以下是一些常见的操作报错及其可能的原因与解决策略。
花开富贵111
42 1
八音盒coding
|
4天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的个人健康数据管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的个人健康数据管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
八音盒coding
6 0

热门文章

最新文章

  • 1
    阿里云数据库内核 Apache Doris 基于 Workload Group 的负载隔离能力解读
  • 2
    Serverless 应用引擎产品使用之在阿里函数计算中，使数据库和阿里云函数计算位于同一个内网中如何解决
  • 3
    数据管理DMS操作报错合集之阿里云DMS控制台上展示出了已经删除的数据库信息，如何解决
  • 4
    云原生数据仓库产品使用合集之ADB如何确保数据库的可用性
  • 5
    开源向量数据库比较：Chroma, Milvus, Faiss,Weaviate
  • 6
    【MySQL】数据库规范化的三大法则 — 一探范式设计原则
  • 7
    【MySQL-10】数据库函数-案例演示【字符串/数值/日期/流程控制函数】（代码演示＆可cv代码）
  • 8
    【Go语言专栏】使用Go语言连接MySQL数据库
  • 9
    doris数据库是否可以替代redis
  • 10
    Doris数据库安装插件流程
  • 1
    前端和后端限制文件大小的具体实现方式
    63
  • 2
    【Web 前端】如何将一个 HTML 元素添加到 DOM 树中的？
    35
  • 3
    【Web 前端】jQuery 里的 each() 是什么函数？你是如何使用它的？
    39
  • 4
    【Web 前端】如何找到所有 HTML select 标签的选中项？
    45
  • 5
    【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同？
    28
  • 6
    【Web 前端】$(document).ready() 是个什么函数？为什么要用它？
    49
  • 7
    【Web 前端】如何在点击一个按钮时使用 jQuery 隐藏一个图片？
    63
  • 8
    从前端Vue到后端Spring Boot：接收JSON数据的正确姿势
    82
  • 9
    【Web 前端】 jQuery 里的 ID 选择器和 class 选择器有何不同？
    54
  • 10
    【Web 前端】网页上有 5 个div元素，如何使用JQ来选择它们？
    62

    • 相关课程

    更多
  • 数据库的前世今生
  • 数据库核心概念
  • 从传统数据库到云数据库演进
  • 数据库常见问题排查
  • 数据库及SQL/MySQL基础
  • 高校精品课-西安交通大学 -数据库理论与技术

    • 相关电子书

    更多
  • 2022 DTCC-阿里云一站式数据库上云最佳实践
  • 云时代的数据库技术趋势
  • 超大型金融机构国产数据库全面迁移成功实践

    • 相关实验场景

    更多
  • PolarDB for AI：在数据库中通过SQL实现AI能力
  • 云原生HTAP数据库，让你的交易和分析一库搞定
  • Excel文件转存到RDS数据库
  • 快速体验PolarDB开源数据库
  • 前端开发基础3：CSS3常见显示属性
  • 前端开发基础6：Node.js和LESS预编译工具

    • 推荐镜像

    更多
  • mysql
  • postgresql
  • mariadb
    • 下一篇
    2024年阿里云免费云服务器及学生云服务器申请教程参考