JAVA总结3

## 1.HTML
⭐快捷键
①快速打出框架：！+回车    
②注释：ctrl+shift+/
③保存：ctrl s            
④打开浏览器：alt+b
#### 标题排版
😊图片标签：img(src:url   width:宽度   height：高度)  
😊标题标签： h1 -  h6
😊水平线标签:hr
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/089995a4-1826-4a6a-942d-62d0d6648fdd.png)
## 2.CSS
#### ①标题样式(CSS选择器)
CSS选择器：用来选取需要设置样式的元素(比如设置字体颜色、大小、背景色等)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/44a89850-44c1-7ad8-0e90-a3cb19f94a2d.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/53851eec-0243-90e5-2dd9-0d4f88a4851a.png)
#### ②超链接（a标签） 
href:指定访问的url         target:指定在哪里打开资源链接
self:在当前页面打开         blank:在空白页面打开
⭐超链接CSS属性：
text-decoration:规定添加到文本的修饰
none:定义标准的文本
#### ③页面布局
😊div:一行只显示一个。
😊span:一行可以显示多个
⭐CSS盒子模型及属性
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/c43eba54-7bc9-9cee-e16d-be9fc09e6a4b.png)
## 3.JS
#### ①变量
let:不能重复定义
const:常量，不能被改变的
#### ②运算符
==：会进行类型转换     ===：不会进行类型转换
#### ③JS函数(function)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/1d18db2c-24f6-dad5-da02-22b59cbb2499.png)
#### ④Array
😊数组长度可变，可以存储任意类型的数据   var 变量名 = [ 元素列表 ];
😊访问：arr[ 索引 ]= 值；
😊方法：
forEach:遍历数组中有值的元素（快捷键：输入fori后按下Tab键）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/51b84518-9ec5-8163-8ece-5a801b8a3e39.png)
添加元素：push
删除元素(从哪个索引开始删，删几个元素)：splice
#### ⑤String
方法：
😊charAt:获取指定位置的字符
😊indexOf:检查字符串，返回索引值
😊trim:去除字符串左右两侧的空格
😊substring:提取字符串中两个指定的索引号之间的字符。开始索引，结束索引，含头不含尾
#### ⑥DOM
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/ee1728c9-69c2-b579-1a9f-9418b2fb50f8.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/de772a99-955b-aaf9-4594-8300df4bdd24.png)
innerHTML：更改内容
TagName:标签名
ByName:属性名
checked=true的话 选中复选框
toLowerCase:变成小写
toUpperCase：变成大写
#### ⑦事件绑定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/8cc2f09b-3467-fabc-089b-44d636d78ce3.png)
## 4.Vue(html,js,css的结合体，框架！)
#### ①常用指令
通过v-bind或者v-model绑定的变量，必须在数据模型中声明
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/0c7600dd-c407-44da-f59c-6ce567d8b60a.png)
#### ②生命周期
mounted:挂载完成（发送请求到服务端，加载数据）
## 5.Axios
①引入Axios的js文件
②使用Axios发送请求，并获取响应结果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/dc0daab2-65fe-313b-568e-af721e6cea31.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/10e56f7e-9686-a4ff-d266-e58f922592c9.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/3021d447-03d8-c37c-b21b-7513386f93a4.png)
## 6.注解
1-RequestMapping：后面添加路径
2-RequestBody:json参数
3-PathVariable：获取路径参数
4-SpringBootApplication:具有包扫面作用，默认扫描当前包及其子包
## 7.数据库操作
查询所有数据库：show databases;
查询当前数据库：select databases();
使用数据库：use 数据库名;
创建数据库：create databases if not exists 数据库名;
删除数据库：drop databases if  exists 数据库名;
## 8.数据操作
#### ①添加数据(insert)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/c2f56310-33e0-594f-cd8f-34f2661d8b49.png)
#### ②修改数据(update)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/e3691eb0-13c0-3c35-de80-fcf478d95386.png)
#### ③删除数据(delete)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/2f584a5e-a99f-b890-f591-898db3ed25c6.png)
## 9.查询
#### ①基本查询
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/a90b8c22-b1c9-4f5f-bf63-748c1ae5c109.png)
#### ②条件查询where
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/d46359b6-be62-bbf3-9db7-7a9ae0c79f04.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/8c1cb071-1cf8-d217-b1ef-4e6e643be6e6.png)
#### ③分组查询group by
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/ed56260b-d167-9c2a-5261-e7b72cc1f9e2.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/ef43a89d-3102-2ab1-d766-22238515bd5e.png)
#### ④排序查询order by
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/ed9bb831-6548-921c-08b9-f4d9e37f68dd.png)
升序（默认）：ASC
降序：DESC
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/c331853c-da26-9d91-f0d2-c2f337826e32.png)
#### ⑤分页查询limit
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/51545d72-7393-2a96-2ffe-1c729119b4b3.png)
起始索引= （页码-1）*每页展示的记录数
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/fee4f56b-56b0-d9ee-632e-bb8df9b98de4.png)
## 10.聚合函数
将一列数据作为一个整体，进行纵向计算
语法：select 聚合函数(字段列表) from 表名；
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/aa3345aa-ac2f-0c32-e4e9-b877fb777d58.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/46274ff1-be13-9e52-f594-852af5325313.png)
## 11.多表设计
一对多：在多的一方添加外键，关联另外一方的主键
一对一：任意一方，添加外键，关联另外一方的主键
多对多：通过中间表来维护，中间表的两个外键，分别关联另外两张表的主键
## 12.多表查询
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/603081b9-2215-3daf-894b-d5f0e81bc0a8.png)
#### ①内连接
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/82764b60-7156-be69-8466-0fe348695b08.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/fd9df761-f3f3-9c63-aae0-d941d624f430.png)
#### ②外连接
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/c7a91214-bc3e-2b18-6545-0e86987ea696.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3899383/9bd6baad-69e2-6db2-c97e-f789e4bfe537.png)
## 13.事务
要么全部成功，要么全部失败
开始事务：start transaction; / begin;
提交事务：commit;
回滚事务：rollback;