JavaWeb

目录

1.初识Web前端

2.HTML 、CSS 

3.基础标签 

4.CSS样式 

5.CSS引入方式 

6.颜色表示形式 

7.CSS选择器 

8.超链接 

9.盒子模型 

10.JavaScript 

11.JS基础语法 

12.数据类型 

13.流程控制语句 

14.JS函数 

15.JS对象 

16.Vue 

17.Ajax 

18.前后端分离开发： 

19.YApi 

20.前端工程化 

21.Vue组件库Element 

22.打包部署 

23.Maven 

24.Springboot快速入门 

25.HTTP协议 

26.Web服务器-Tomcat

27.请求响应 

28.三层架构 

29.分层解耦 

30.案例 

31.IOC详解 

32.DI详解 

33.注解 

34.MySQL （数据库）

        （1） 介绍

        （2）数据库产品 

        （3）MySQL安装 

                1.MySQL下载 

                2.解压 

                3.配置环境变量

                4.验证是否添加成功 

                5.初始化MySQL 

                6.注册MySQL服务  

                7.启动、停止 MySQL服务

                8.修改默认账户密码 

                9.登录 MySQL

                9.退出mysql指令 

                10.卸载mysql 

        （4）MySQL数据模型 

        （5）SQL简介

        （6）SQL分类 

        （7）DDL 

        （8）约束 

        （9）MySQL客户端工具-图形化工具

        （10）数据类型

                        1.数值类型 

                        2.日期和时间类型 

                        3.字符串类型 

        （11）DML 

        （12）DQL

                1.DQL- 基本查询

                2.DQL- 条件查询 

                3.DQL- 聚合函数 

                4.DQL- 分组查询

                5.DQL- 排序查询 

                6.DQL- 分页查询

        （13） DCL

        （14） 函数：

                         1.字符串函数

                        2.数值函数

                        3.日期函数

                        4.流程函数

        （15）多表设计

                        1.一对多 （多对一）

                        2.一对一 

                        3.多对多 

        （16）外键约束 

                        1.物理外键 

                        2.逻辑外键 

        （17）多表查询 

                        1.概述 

                        2.分类 

                        3.内连接 

                        4.外连接 

                        5.自连接 

                        6.联合查询 

                        7.子查询 

                        8.案例 

        （18）事物 

                        1.介绍 

                        2.四大特性 

                        3.事物的并发问题 

                        4.事务隔离级别 

                        5.存储引擎 

        （19）索引 

                        1.介绍 

                        2.优缺点 

                        3.索引结构 

                        4.索引语法 

---

1.初识Web前端

        （1）介绍： 

                        Web标准也称为网页标准，由一系列的标准组成，大部分由W3C（ World Wide Web Consortium，万维网联盟）负责制定 

                        三个组成部分： 

                                HTML：负责网页的结构（页面元素和内容） 

                                CSS：负责网页的表现（页面元素的外观、位置等页面样式，如：颜色、大小等 

                                JavaScript：负责网页的行为（交互效果） 

2.HTML 、CSS 

        （1）HTML介绍： 

                        HTML（HyperText Markup Language）：超文本标记语言 

                        超文本：超越了文本的限制，比普通文本更强大。除了文字信息，还可以定义图片、音频、视频等内容 

                        标记语言：由标签构成的语言： 

                                HTML标签都是预定义好的。例如：使用展示超链接，使用展示图片，

                                HTML代码直接在浏览器中运行，HTML标签由浏览器解析 

        （2）CSS介绍： 

                        CSS（Cascading Style Sheet）：层叠样式表，用于控制页面的样式（表现） 

        （3）HTML快速入门： 

                        1.新建文本文件，后缀名改为 .html 

                        2.编写 HTML 结构标签 

                        3.在中填写内容 

HTML结构标签：


	    
		   
	
	
    
	

                        特点： 

                                1.HTML标签不区分大小写 

                                2.HTML标签属性值单双引号都可以 

                                3.HTML语法松散 

3.基础标签 

        （1）图片标签： 

图片标签：



src：指定图像的url（绝对路径 / 相对路径）
width：图像的宽度（像素 / 相对于父元素的百分比）
height：图像的高度（像素 / 相对于父元素的百分比）

        （2）标题标签： 

标题标签：
 - 

        （3）水平线标签： 

水平线标签：

        （4）标签： 

                         是一个在开发网页时大量会用到的没有语义的布局标签 

                        特点：一行可以显示多个(组合行内元素)，宽度和高度默认由内容撑开 

        （5）音频、视频标签： 

音频标签：
    

        （6）换行、段落标签： 

换行：
 ; 段落：


注意：
    在HTML中无论输入多少个空格，只会显示一个。 可以使用空格占位符： 

        （7）文本加粗标签： 

        （8）表格标签： 

：定义表格
：定义表格中的行，一个  表示一行
：表示表头单元格，具有加粗居中效果
：表示普通单元格

        （9）表单标签： 

表单项：不同类型的 input 元素、下拉列表、文本域等
    ：定义表单项，通过type属性控制输入形式
    ：定义下拉列表
    ：定义文本域

属性：
     action：规定当提交表单时向何处发送表单数据，URL
     method：规定用于发送表单数据的方式。GET、POST

表单项：

    <input>：定义表单项，通过type属性控制输入形式
    <select>：定义下拉列表
    <textarea>：定义文本域

<input>的type取值：

    text	默认值，定义单行的输入字段
    password	定义密码字段
    radio	定义单选按钮
    checkbox	定义复选框
    file	定义文件上传按钮
    date/time/datetime-local	定义日期/时间/日期时间
    number	定义数字输入框
    email	定义邮件输入框
    hidden	定义隐藏域
    submit / reset / button	定义提交按钮 / 重置按钮 / 可点击按钮
</code></pre> 
  <p></p> 
  <h3 id="4.CSS%E6%A0%B7%E5%BC%8F%C2%A0">4.CSS样式 </h3> 
  <pre><code class="language-html">font-size：字体大小 （注意：记得加px）
line-height：设置行高
text-indent：定义第一个行内容的缩进
text-align：规定元素中的文本的水平对齐方式
width：设置宽度
height：设置高度
border：设置边框的属性，如：1px solid #000；
padding：内边距
margin：外边距

注意：如果只需要设置某一个方位的边框、内边距、外边距，可以在属性名后加上 –位置，如：padding-top、padding-left、padding-right …
</code></pre> 
  <p></p> 
  <h3 id="5.CSS%E5%BC%95%E5%85%A5%E6%96%B9%E5%BC%8F%C2%A0">5.CSS引入方式 </h3> 
  <p>         （1）行内样式：</p> 
  <p>                        写在标签的style属性中（不推荐）</p> 
  <pre><code class="language-html">行内样式：
<h1 style="...">

例：
<h1 style="属性名: 属性值; 属性名: 属性值;">内容</h1>
</code></pre> 
  <p>        （2）内嵌样式：</p> 
  <p>                        写在style标签中（可以写在页面任何位置，但通常约定写在head标签中） </p> 
  <pre><code class="language-html">内嵌样式：
<style> … </style>

例：
<style>
  h1 {
     属性名: 属性值; 
     属性名: 属性值;
  }
</style>
</code></pre> 
  <p>        （3）外联样式：</p> 
  <p>                        写在一个单独的.css文件中（需要通过 link 标签在网页中引入） </p> 
  <pre><code class="language-html">外联样式:
xxx.css     <link href="css/xxx.css"></code></pre> 
  <p></p> 
  <h3 id="6.%E9%A2%9C%E8%89%B2%E8%A1%A8%E7%A4%BA%E5%BD%A2%E5%BC%8F%C2%A0">6.颜色表示形式 </h3> 
  <p>        （1）关键字： </p> 
  <p>                        表示含义：预定义的颜色名        取值：red、green、blue... </p> 
  <p>        （2）rgb表示法： </p> 
  <p>                         表示含义：红绿蓝三原色，每项取值范围：0-255       </p> 
  <p>                                取值：rgb(0,0,0)、rgb(255,255,255)、rgb(255,0,0)</p> 
  <p>        （3）十六进制表示法： </p> 
  <p>                        表示含义：#开头，将数字转换成十六进制表示 </p> 
  <p>                                取值：#000000、#ff0000、#cccccc，简写：#000、#ccc </p> 
  <p>        （4）颜色属性： </p> 
  <p>                        color: 设置文本内容的颜色  </p> 
  <p></p> 
  <h3 id="7.CSS%E9%80%89%E6%8B%A9%E5%99%A8%C2%A0">7.CSS选择器 </h3> 
  <p>        （1）介绍： </p> 
  <p>                        用来选取需要设置样式的元素(标签) </p> 
  <p>        （2）分类： </p> 
  <p>                        1.元素选择器： </p> 
  <pre><code class="language-html">元素选择器：

元素名称 {
    color: red;
}

例：

<h1> Hello CSS </h1>

h1 {
    color: red;
}

</code></pre> 
  <p>                        2.id选择器： </p> 
  <pre><code class="language-html">id选择器：

#id属性值 {
    color: red;
}

例：

<h1 id="hid"> CSS id Selector</h1>

#hid {
    color: red;
}
</code></pre> 
  <p>                        3.类选择器： </p> 
  <pre><code class="language-html">类选择器：

.class属性值 {
    color: red;
}

例：

<h1 class="cls">CSS class Selector</h1>

.cls {
    color: red;
}
</code></pre> 
  <p>        （3）选择器优先级：</p> 
  <p>                        id选择器 > 类选择器 > 元素选择器 </p> 
  <p></p> 
  <h3 id="8.%E8%B6%85%E9%93%BE%E6%8E%A5%C2%A0">8.超链接 </h3> 
  <p>        （1）标签：                      </p> 
  <pre><code class="language-html"><a href="..." target="...">央视网</a></code></pre> 
  <p>        （2）属性： </p> 
  <pre><code class="language-html">	href：指定资源访问的url
	target：指定在何处打开资源链接
	_self：默认值，在当前页面打开
	_blank：在空白页面打开


text-decoration：规定添加到文本的修饰，none表示定义标准的文本
</code></pre> 
  <p>        （3）案例： </p> 
  <pre><code class="language-html"><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>焦点访谈：中国底气 新思想夯实大国粮仓</title>
    <style>
        h1 {
            color: #4D4F53;
        }
        
        #time {
            color: #968D92;
            font-size: 13px; /* 设置字体大小 */
        }

        a {
            color: black;
            text-decoration: none; /* 设置文本为一个标准的文本 */
        }
    </style>
</head>
<body>

    <img src="img/news_logo.png"> <a href="http://gov.sina.com.cn/" target="_self">新浪政务</a>  > 正文

    <h1>焦点访谈：中国底气 新思想夯实大国粮仓</h1>

    <hr>
    <span id="time">2023年03月02日 21:50</span>  <span> <a href="https://news.cctv.com/2023/03/02/ARTIUCKFf9kE9eXgYE46ugx3230302.shtml" target="_blank">央视网</a></span>
    <hr>

</body>
</html></code></pre> 
  <p></p> 
  <h3 id="9.%E7%9B%92%E5%AD%90%E6%A8%A1%E5%9E%8B%C2%A0">9.盒子模型 </h3> 
  <p>        （1）介绍： </p> 
  <p>                        盒子：页面中所有的元素（标签），都可以看做是一个 盒子，由盒子将页面中的元素包含在一个矩形区域内，通过盒子的视角更方便的进行页面布局 </p> 
  <p>        （2） 组成：</p> 
  <p>                        内容区域（content）、内边距区域（padding）、边框区域（border）、外边距区域（margin） </p> 
  <p></p> 
  <h3 id="10.JavaScript%C2%A0">10.JavaScript </h3> 
  <p>        （1）介绍： </p> 
  <p>                        JavaScript（简称：JS） 是一门跨平台、面向对象的脚本语言。是用来控制网页行为的，它能使网页可交互 </p> 
  <p>                        JavaScript 和 Java 是完全不同的语言，不论是概念还是设计。但是基础语法类似 </p> 
  <p>                        JavaScript 在 1995 年由 Brendan Eich 发明，并于 1997 年成为 ECMA 标准 </p> 
  <p>                        ECMAScript6 (ES6) 是最主流的 JavaScript 版本（发布于 2015 年) </p> 
  <p>                       <span style="color:#fe2c24;"> ECMA： ECMA国际（前身为欧洲计算机制造商协会），制定了标准化的脚本程序设计语言 ECMAScript，这种语言得到广泛应用。而JavaScript是遵守ECMAScript的标准的</span> </p> 
  <p>        （2）JS引入方式： </p> 
  <p>                        1.内部脚本：将JS代码定义在HTML页面中 </p> 
  <p>                                JavaScript代码必须位于<script></script>标签之间 </p> 
  <p>                                在HTML文档中，可以在任意地方，放置任意数量的<script> </p> 
  <p>                                一般会把脚本置于<body>元素的底部，可改善显示速度 </p> 
  <pre><code class="language-javascript"><script>
    alert("Hello JavaScript")
</script>

建议：将<script></script>放在<body>的底部
</code></pre> 
  <p>                            2.外部脚本：将 JS代码定义在外部 JS文件中，然后引入到 HTML页面中 </p> 
  <p>                                外部JS文件中，只包含JS代码，不包含<script>标签 </p> 
  <p>                                <script>标签不能自闭合 </p> 
  <pre><code class="language-javascript"><script src="js/demo.js"></script>

demo.js

</code></pre> 
  <p></p> 
  <h3 id="11.JS%E5%9F%BA%E7%A1%80%E8%AF%AD%E6%B3%95%C2%A0">11.JS基础语法 </h3> 
  <p>        （1）书写语法： </p> 
  <p>                        1.区分大小写：与 Java 一样，变量名、函数名以及其他一切东西都是区分大小写的 </p> 
  <p>                        2.每行结尾的分号可有可无 </p> 
  <p>                        3.注释： </p> 
  <p>                                单行注释：// 注释内容 </p> 
  <p>                                多行注释：/* 注释内容 */ </p> 
  <p>                        4.大括号表示代码块 </p> 
  <pre><code class="language-javascript">//判断
if(count == 3){
    alert(count);
}
</code></pre> 
  <p>        （2）输出语句： </p> 
  <p>                        1.使用 window.alert() 写入警告框 </p> 
  <p>                        2.使用 document.write() 写入 HTML 输出 </p> 
  <p>                        3.使用 console.log() 写入浏览器控制台 </p> 
  <pre><code class="language-javascript"><script>
    window.alert("Hello JavaScript"); //浏览器弹出警告框
    
    document.write("Hello JavaScript"); //写入HTML,在浏览器展示
    console.log("Hello JavaScript"); //写入浏览器控制台
</script>
</code></pre> 
  <p>        （3）变量： </p> 
  <p>                        1.JavaScript 中用 var 关键字（variable 的缩写）来声明变量 </p> 
  <pre><code class="language-javascript">var a = 20;
a = "张三";</code></pre> 
  <p>                      <span style="color:#fe2c24;">  2.JavaScript 是一门弱类型语言，变量可以存放不同类型的值  </span></p> 
  <p>                        <span style="color:#38d8f0;">3.变量名需要遵循如下规则： </span></p> 
  <p><span style="color:#38d8f0;">                                组成字符可以是任何字母、数字、下划线（_）或美元符号（$） </span></p> 
  <p><span style="color:#38d8f0;">                                数字不能开头 </span></p> 
  <p><span style="color:#38d8f0;">                                建议使用驼峰命名</span></p> 
  <p>                      <span style="color:#fe2c24;">  注意事项： </span></p> 
  <p><span style="color:#fe2c24;">                                1.ECMAScript 6 新增了 let 关键字来定义变量。它的用法类似于 var，但是所声明的变量，只在 let 关键字所在的代码块内有效，且不允许重复声明 </span></p> 
  <p><span style="color:#fe2c24;">                                2.ECMAScript 6 新增了 const 关键字，用来声明一个只读的常量。一旦声明，常量的值就不能改变 </span></p> 
  <pre><code class="language-javascript">声明：
	var：声明变量，全局作用域/函数作用域，允许重复声明
	let：声明变量，块级作用域，不允许重复声明
	const：声明常量，一旦声明，常量的值不能改变
</code></pre> 
  <p></p> 
  <h3 id="12.%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B%C2%A0">12.数据类型 </h3> 
  <p>        （1）JavaScript中分为：原始类型 和 引用类型     </p> 
  <pre><code class="language-javascript"> number：数字（整数、小数、NaN(Not a Number)）
 string：字符串，单双引皆可
 boolean：布尔。true，false
 null：对象为空
 undefined：当声明的变量未初始化时，该变量的默认值是 undefined
 使用 typeof 运算符可以获取数据类型
</code></pre> 
  <p>        （2）运算符： </p> 
  <pre><code class="language-javascript"> 算术运算符：+ , - , * , / , % , ++ , --
 赋值运算符：= , += , -= , *= , /= , %=
 比较运算符：> , < , >= , <= , != , == , === 
 逻辑运算符：&& , || , !
 三元运算符：条件表达式 ? true_value: false_value

== 会进行类型转换，=== 不会进行类型转换

var a = 10;
alert(a == "10"); //true
alert(a === "10"); //false
alert(a === 10); //true
</code></pre> 
  <p>        （3）类型转换： </p> 
  <p>                        1.字符串类型转为数字： </p> 
  <p>                                将字符串字面值转为数字。 如果字面值不是数字，则转为NaN </p> 
  <p>                        2.其他类型转为boolean </p> 
  <p>                                Number：0 和 NaN为false，其他均转为true </p> 
  <p>                                String：空字符串为false，其他均转为true </p> 
  <p>                                Null 和 undefined ：均转为false </p> 
  <p></p> 
  <h3 id="13.%E6%B5%81%E7%A8%8B%E6%8E%A7%E5%88%B6%E8%AF%AD%E5%8F%A5%C2%A0">13.流程控制语句 </h3> 
  <pre><code class="language-javascript">if…else if …else…

 switch

 for 

 while

 do … while
</code></pre> 
  <p></p> 
  <h3 id="14.JS%E5%87%BD%E6%95%B0%C2%A0">14.JS函数 </h3> 
  <p>        （1）介绍： </p> 
  <p>                        函数（方法）是被设计为执行特定任务的代码块 </p> 
  <p>        （2）定义： </p> 
  <p>                         JavaScript 函数通过 function 关键字进行定义</p> 
  <p>                        语法：</p> 
  <p>                                方式一： </p> 
  <pre><code class="language-javascript">function functionName(参数1,参数2..){
   //要执行的代码
}

function add(a , b){
    return a + b;
}

调用：

var result = add(10,20);
alert(result)


</code></pre> 
  <p>                                方式二： </p> 
  <pre><code class="language-javascript">var functionName = function (参数1,参数2..){
    //要执行的代码
}

var add = function(a , b){
    return a + b;
}

调用：

var result = add(10,20);
alert(result)


</code></pre> 
  <p></p> 
  <p>                        注意： </p> 
  <p>                                1.形式参数不需要类型。因为JavaScript是弱类型语言 </p> 
  <p>                                2.返回值也不需要定义类型，可以在函数内部直接使用return返回即可 </p> 
  <p>                        调用：</p> 
  <p>                                函数名称(实际参数列表) </p> 
  <pre><code class="language-javascript">var result = add(10,20);
alert(result)

JS中，函数调用可以传递任意个数的参数</code></pre> 
  <p></p> 
  <h3 id="15.JS%E5%AF%B9%E8%B1%A1%C2%A0">15.JS对象 </h3> 
  <p>        （1）Array： </p> 
  <p>                        JavaScript 中 Array对象用于定义数组 </p> 
  <p>                        定义：                                </p> 
  <pre><code class="language-javascript">方式一：

var 变量名 = new Array(元素列表); 
var arr = new Array(1,2,3,4);

方式二：

var 变量名 = [ 元素列表 ]; 
var arr = [1,2,3,4];

访问：

arr[ 索引 ] = 值; 
arr[10] = "hello";

注意：
    JavaScript 中的数组相当于 Java 中集合，数组的长度是可变的，而 JavaScript 是弱类型，所以可以存储任意的类型的数据
</code></pre> 
  <p>                        属性和方法： </p> 
  <pre><code class="language-javascript">属性：
length	设置或返回数组中元素的数量。

方法：
forEach()	遍历数组中的每个有值的元素，并调用一次传入的函数
push()	将新元素添加到数组的末尾，并返回新的长度。
splice()	从数组中删除元素。</code></pre> 
  <p>        （2）String： </p> 
  <p>                        String字符串对象创建方式： </p> 
  <pre><code class="language-javascript">方式一：
var 变量名 = new String("…") ; 
var str = new String("Hello String");

方式二：
var 变量名 = "…" ; 
var str = "Hello String";
var str = 'Hello String';


</code></pre> 
  <p>                        属性和方法： </p> 
  <pre><code class="language-javascript">属性：
length	字符串的长度。

方法：
charAt()	返回在指定位置的字符。
indexOf()	检索字符串。
trim()	去除字符串两边的空格
substring()	提取字符串中两个指定的索引号之间的字符。</code></pre> 
  <p>        （3）JavaScript自定义对象： </p> 
  <p>                        定义格式： </p> 
  <pre><code class="language-javascript">var 对象名 = {
属性名1: 属性值1, 
属性名2: 属性值2,
属性名3: 属性值3,
函数名称: function(形参列表){}
};

var user = {
    name:"Tom", 
    age:20, 
    gender:"male",
    eat: function(){
        alert("用膳~");
    }
};

var user = {
    name:"Tom", 
    age:20, 
    gender:"male",
    eat(){
        alert("用膳~");
    }
};


</code></pre> 
  <p>                        调用格式： </p> 
  <pre><code class="language-javascript">对象名.属性名;
console.log(user.name);

对象名.函数名();
user.eat();</code></pre> 
  <p>        （4）JSON： </p> 
  <p>                         概念：JavaScript Object Notation，JavaScript对象标记法</p> 
  <p>                         JSON 是通过 JavaScript 对象标记法书写的文本</p> 
  <pre><code class="language-javascript">{
    name:"Tom", 
    age:20, 
    gender:"male"
};


{
    "name":"Tom",
    "age":20,
    "gender":"male"
}
</code></pre> 
  <p>                        JSON-基础语法 ：</p> 
  <pre><code class="language-javascript">定义：
    var 变量名 = '{"key1": value1, "key2": value2}';
示例：
    var userStr = '{"name":"Jerry","age":18, "addr":["北京","上海","西安"]}';

JSON字符串转为JS对象：
    var jsObject = JSON.parse(userStr);

JS对象转为JSON字符串：
    var jsonStr = JSON.stringify(jsObject);


value 的数据类型为：
    数字（整数或浮点数）
    字符串（在双引号中）
    逻辑值（true 或 false）
    数组（在方括号中）
    对象（在花括号中）
    null
</code></pre> 
  <p>        （5）BOM： </p> 
  <p>                        概念：Browser Object Model  浏览器对象模型，允许JavaScript与浏览器对话， JavaScript 将浏览器的各个组成部分封装为对象。 </p> 
  <p>                      <span style="color:#fe2c24;"> 组成： </span></p> 
  <p><span style="color:#fe2c24;">                                Window：浏览器窗口对象 </span></p> 
  <p><span style="color:#fe2c24;">                                Navigator：浏览器对象 </span></p> 
  <p><span style="color:#fe2c24;">                                Screen：屏幕对象 </span></p> 
  <p><span style="color:#fe2c24;">                                History：历史记录对象 </span></p> 
  <p><span style="color:#fe2c24;">                                Location：地址栏对象</span></p> 
  <p>                       Window：</p> 
  <p>                                介绍：浏览器窗口对象</p> 
  <p>                                获取：直接使用window，其中 window. 可以省略 </p> 
  <pre><code class="language-javascript">window.alert("Hello Window");
alert("Hello Window");

属性：
     history：对 History 对象的只读引用
     location：用于窗口或框架的 Location 对象
     navigator：对 Navigator 对象的只读引用

方法：
     alert()：显示带有一段消息和一个确认按钮的警告框。
     confirm()：显示带有一段消息以及确认按钮和取消按钮的对话框。
     setInterval()：按照指定的周期（以毫秒计）来调用函数或计算表达式。
     setTimeout()：在指定的毫秒数后调用函数或计算表达式。
</code></pre> 
  <p>                        Location： </p> 
  <p>                                介绍：地址栏对象 </p> 
  <p>                                获取：使用 window.location 获取，其中 window. 可以省略 </p> 
  <pre><code class="language-javascript">window.location.属性;
location.属性;

属性：
    href：设置或返回完整的URL
    location.href = "https://www.taobao.com";</code></pre> 
  <p>        （6）DOM： </p> 
  <p>                      <span style="color:#fe2c24;">  概念：Document Object Model ，文档对象模型，将标记语言的各个组成部分封装为对应的对象 </span></p> 
  <pre><code class="language-javascript">Document：整个文档对象
Element：元素对象
Attribute：属性对象
Text：文本对象
Comment：注释对象
</code></pre> 
  <pre><code class="language-javascript">DOM是 W3C（万维网联盟）的标准，定义了访问HTML和XML文档的标准，分为3个不同的部分：
    Core DOM - 所有文档类型的标准模型：
        Document：整个文档对象
        Element：元素对象
        Attribute：属性对象
        Text：文本对象
        Comment：注释对象

    XML DOM - XML 文档的标准模型  
    HTML DOM - HTML 文档的标准模型
    Image：<img>
    Button ：<input type='button'>


<html>
    <head>
        <title>DOM</title>
    </head>
    <body>
        <h1>DOM对象标题</h1>
        <a href="https://taobao.com">淘宝</a>
    </body>
</html>
</code></pre> 
  <p>                       <span style="color:#fe2c24;"> HTML中的Element对象可以通过Document对象获取，而Document对象是通过window对象获取的 </span></p> 
  <p>                        Document对象中提供了以下获取Element元素对象的函数： </p> 
  <pre><code class="language-javascript">1.根据id属性值获取，返回单个Element对象
var h1 = document.getElementById('h1');

2.根据标签名称获取，返回Element对象数组
var divs = document.getElementsByTagName('div');

3.根据name属性值获取，返回Element对象数组
var hobbys = document.getElementsByName('hobby');

4.根据class属性值获取，返回Element对象数组
var clss = document.getElementsByClassName('cls');

</code></pre> 
  <p>                        案例： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/d922c1d39a04481890aac1609bba6106.jpg" target="_blank"><img alt="JavaWeb_第2张图片" height="438" src="http://img.e-com-net.com/image/info8/d922c1d39a04481890aac1609bba6106.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        代码： </p> 
  <pre><code class="language-html"><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS-对象-DOM-案例</title>
</head>

<body>
    <img id="h1" src="img/off.gif">  <br><br>

    <div class="cls">小米锅巴</div>   <br>
    <div class="cls">宫保鸡丁</div>  <br>

    <input type="checkbox" name="hobby"> 电影
    <input type="checkbox" name="hobby"> 旅游
    <input type="checkbox" name="hobby"> 游戏
</body>

<script>
    //1. 点亮灯泡 : src 属性值
    var img = document.getElementById('h1');
    img.src = "img/on.gif";


    //2. 将所有div标签的内容后面加上: very good (红色字体) -- <font color='red'></font>
    var divs = document.getElementsByTagName('div');
    for (let i = 0; i < divs.length; i++) {
        const div = divs[i];
        div.innerHTML += "<font color='red'>very good</font>"; 
    }


    //3. 使所有的复选框呈现选中状态
    var ins = document.getElementsByName('hobby');
    for (let i = 0; i < ins.length; i++) {
        const check = ins[i];
        check.checked = true;//选中
    }

</script>
</html></code></pre> 
  <p>        （7）事件监听： </p> 
  <p>                        事件：HTML事件是发生在HTML元素上的 “事情”，比如： </p> 
  <p>                                1.按钮被点击 </p> 
  <p>                                2.鼠标移动到元素上 </p> 
  <p>                                3.按下键盘按键 </p> 
  <p>                        事件监听：JavaScript可以在事件被侦测到时 执行代码 </p> 
  <p>        （8）事件绑定：</p> 
  <pre><code class="language-javascript">方式一：通过 HTML标签中的事件属性进行绑定

<input type="button" onclick="on()" value="按钮1">

<script>
    function on(){
        alert('我被点击了!');
    }
</script>

方式二：通过 DOM 元素属性绑定

<input type="button" id="btn" value="按钮2">

<script>
    document.getElementById('btn').onclick=function(){
        alert('我被点击了!');
    }
</script>




</code></pre> 
  <p>                        常见事件： </p> 
  <pre><code class="language-javascript">常见事件：

onclick	鼠标单击事件
onblur	元素失去焦点
onfocus	元素获得焦点
onload	某个页面或图像被完成加载
onsubmit	当表单提交时触发该事件
onkeydown	某个键盘的键被按下
onmouseover	鼠标被移到某元素之上
onmouseout	鼠标从某元素移开</code></pre> 
  <p>                        案例：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/4c825ed5df634f3eb3fe912600c091b9.jpg" target="_blank"><img alt="JavaWeb_第3张图片" height="317" src="http://img.e-com-net.com/image/info8/4c825ed5df634f3eb3fe912600c091b9.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        代码： </p> 
  <pre><code class="language-html"><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS-事件-案例</title>
</head>
<body>

    <img id="light" src="img/off.gif"> <br>

    <input type="button" value="点亮" onclick="on()"> 
    <input type="button"  value="熄灭" onclick="off()">

    <br> <br>

    <input type="text" id="name" value="Hello" onfocus="lower()" onblur="upper()">
    <br> <br>

    <input type="checkbox" name="hobby"> 电影
    <input type="checkbox" name="hobby"> 旅游
    <input type="checkbox" name="hobby"> 游戏
    <br>

    <input type="button" value="全选" onclick="checkAll()"> 
    <input type="button" value="反选" onclick="reverse()">

</body>

<script>

    //1. 点击 "点亮" 按钮, 点亮灯泡; 点击 "熄灭" 按钮, 熄灭灯泡; -- onclick
    function on(){
        //a. 获取img元素对象
        var img = document.getElementById("light");

        //b. 设置src属性
        img.src = "img/on.gif";
    }

    function off(){
        //a. 获取img元素对象
        var img = document.getElementById("light");

        //b. 设置src属性
        img.src = "img/off.gif";
    }



    //2. 输入框聚焦后, 展示小写; 输入框离焦后, 展示大写; -- onfocus , onblur
    function lower(){//小写
        //a. 获取输入框元素对象
        var input = document.getElementById("name");

        //b. 将值转为小写
        input.value = input.value.toLowerCase();
    }

    function upper(){//大写
        //a. 获取输入框元素对象
        var input = document.getElementById("name");

        //b. 将值转为大写
        input.value = input.value.toUpperCase();
    }



    //3. 点击 "全选" 按钮使所有的复选框呈现选中状态 ; 点击 "反选" 按钮使所有的复选框呈现取消勾选的状态 ; -- onclick
    function checkAll(){
        //a. 获取所有复选框元素对象
        var hobbys = document.getElementsByName("hobby");

        //b. 设置选中状态
        for (let i = 0; i < hobbys.length; i++) {
            const element = hobbys[i];
            element.checked = true;
        }

    }
    
    function reverse(){
        //a. 获取所有复选框元素对象
        var hobbys = document.getElementsByName("hobby");

        //b. 设置未选中状态
        for (let i = 0; i < hobbys.length; i++) {
            const element = hobbys[i];
            element.checked = !element.checked;
        }
    }



</script>
</html></code></pre> 
  <p></p> 
  <h3 id="16.Vue%C2%A0">16.Vue </h3> 
  <p>        （1）介绍： </p> 
  <p>                       <span style="color:#fe2c24;"> Vue 是一套前端框架，免除原生JavaScript中的DOM操作，简化书写 </span></p> 
  <p>                        基于MVVM(Model-View-ViewModel)思想，实现数据的双向绑定，将编程的关注点放在数据上 </p> 
  <p>                        官网： https://v2.cn.vuejs.org/ </p> 
  <p>                        <span style="color:#38d8f0;">框架：是一个半成品软件，是一套可重用的、通用的、软件基础代码模型。基于框架进行开发，更加快捷、更加高效 </span></p> 
  <p>        （2）Vue快速入门： </p> 
  <pre><code class="language-javascript">1.新建HTML页面，引入Vue.js文件
<script src="js/vue.js"></script>

2.在JS代码区域，创建Vue核心对象，定义数据模型
<script>
    new Vue({
        el: "#app",
        data: {
            message: "Hello Vue!"
        }
    })
</script>

3.编写视图
<div id="app">
    <input type="text" v-model="message">
    {{ message }}
</div>

</code></pre> 
  <p>        （3）插值表达式： </p> 
  <p>                        形式：{{ 表达式 }} </p> 
  <p>                        内容可以是： </p> 
  <p>                                <strong>变量、三元运算符、函数调用、算术运算</strong> </p> 
  <p>        （4）常用指令： </p> 
  <p>                        指令：HTML 标签上带有 v- 前缀 的特殊属性，不同指令具有不同含义。例如：v-if，v-for… </p> 
  <pre><code class="language-javascript">v-bind	为HTML标签绑定属性值，如设置 href , css样式等
v-model	在表单元素上创建双向数据绑定
v-on	为HTML标签绑定事件
v-if	条件性的渲染某元素，判定为true时渲染,否则不渲染
v-else-if
v-else
v-show	根据条件展示某元素，区别在于切换的是display属性的值
v-for	列表渲染，遍历容器的元素或者对象的属性

1.v-bind
<a v-bind:href="url">学成在线</a>
<a :href="url">学成在线</a>

2.v-model
<input type="text" v-model="url">

<script>
  new Vue({
     el: "#app",
     data: {
        url: "https://www.itcast.cn"
     }
  })
</script>

注意：
    通过v-bind或者v-model绑定的变量，必须在数据模型中声明

3.v-on
<input type="button" value="按钮" v-on:click="handle()">
<input type="button" value="按钮" @click="handle()">

<script>
    new Vue({
        el: "#app",
        data: {
	//...
        },
        methods: {
            handle:function(){
                alert('我被点击了');
            }
        },
    })
</script>


4.v-if
年龄{{age}},经判定为:
<span v-if="age <= 35">年轻人</span>
<span v-else-if="age > 35 && age < 60">中年人</span>
<span v-else>老年人</span>


5.v-show
年龄{{age}},经判定为:
<span v-show="age <= 35">年轻人</span>


6.v-for
<div v-for="addr in addrs">{{addr}}</div>
<div v-for="(addr,index) in addrs">{{index + 1}} : {{addr}}</div>

data: {
   . . .
   addrs: ['北京','上海','广州','深圳','成都','杭州']
}



</code></pre> 
  <p>        （5）生命周期： </p> 
  <p>                        生命周期：指一个对象从创建到销毁的整个过程 </p> 
  <p>                        <span style="color:#fe2c24;">生命周期的八个阶段：每触发一个生命周期事件，会自动执行一个生命周期方法(钩子) </span></p> 
  <pre><code class="language-javascript">状态：                    阶段周期：
    beforeCreate	            创建前
    created	                    创建后
    beforeMount	                挂载前
    mounted	                    挂载完成
    beforeUpdate	            更新前
    updated	                    更新后
    beforeDestroy	            销毁前
    destroyed	                销毁后</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/e9ac023781c547dd840c71d82ae079ee.jpg" target="_blank"><img alt="JavaWeb_第4张图片" height="321" src="http://img.e-com-net.com/image/info8/e9ac023781c547dd840c71d82ae079ee.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        生命周期的八个阶段：每触发一个生命周期事件，会自动执行一个生命周期方法(钩子)  </p> 
  <pre><code class="language-javascript"><script>
    new Vue({
        el: "#app",
        data: {
            
        },
        mounted() {
            console.log("Vue挂载完毕,发送请求获取数据");
        },
        methods: {
           
        },
    })
</script>
</code></pre> 
  <p>                        <span style="color:#fe2c24;">mounted：挂载完成，Vue初始化成功，HTML页面渲染成功。（发送请求到服务端，加载数据） </span></p> 
  <p></p> 
  <h3 id="17.Ajax%C2%A0">17.Ajax </h3> 
  <p>        （1）介绍： </p> 
  <p>                        Asynchronous JavaScript And XML，异步的JavaScript和XML </p> 
  <p>       <span style="color:#38d8f0;"> （2）作用： </span></p> 
  <p><span style="color:#38d8f0;">                        数据交换：通过Ajax可以给服务器发送请求，并获取服务器响应的数据 </span></p> 
  <p><span style="color:#38d8f0;">                        异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索联想、用户名是否可用的校验等等</span></p> 
  <p>        （3）同步与异步的区别： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/069b0c7b5d0f4a69a11bb998a373f2be.jpg" target="_blank"><img alt="JavaWeb_第5张图片" height="316" src="http://img.e-com-net.com/image/info8/069b0c7b5d0f4a69a11bb998a373f2be.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （4）原生Ajax： </p> 
  <p>                        1.准备数据地址 </p> 
  <p>                        2.创建XMLHttpRequest对象：用于和服务器交换数据 </p> 
  <p>                        3.向服务器发送请求 </p> 
  <p>                        4.获取服务器响应数据 </p> 
  <pre><code class="language-javascript"><body>
    <input type="button" value="获取数据" onclick="getData()">
    <div id="div1"></div></body>

<script>
    function getData(){
        1.创建XMLHttpRequest 
        var xmlHttpRequest  = new XMLHttpRequest();
        2.发送异步请求
        xmlHttpRequest.open('GET','http://yapi.smart-xwork.cn/mock/169327/emp/list');
        xmlHttpRequest.send();//发送请求
        3.获取服务响应数据
        xmlHttpRequest.onreadystatechange = function(){
            if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){
                document.getElementById('div1').innerHTML = xmlHttpRequest.responseText;
            }
        }
    }
</script>
</code></pre> 
  <p>        （5）Axios： </p> 
  <p>                        介绍：Axios 对原生的Ajax进行了封装，简化书写，快速开发 </p> 
  <p>                        官网： https://www.axios-http.cn/ </p> 
  <p>                        Axios入门： </p> 
  <pre><code class="language-javascript">1.引入Axios的js文件
<script src="js/axios-0.18.0.js"></script>

2.使用Axios发送请求，并获取响应结果

get请求：

axios({
    method: "get",
    url: "http://yapi.smart-xwork.cn/mock/169327/emp/list"
}).then((result) => {
    console.log(result.data);
});

post请求：

axios({
    method: "post",
    url: "http://yapi.smart-xwork.cn/mock/169327/emp/deleteById",
    data: "id=1"
}).then((result) => {
    console.log(result.data);
});
</code></pre> 
  <p>                        Axios请求方式： </p> 
  <pre><code class="language-javascript">axios.get(url [, config])
axios.delete(url [, config])
axios.post(url [, data[, config]])
axios.put(url [, data[, config]])

1.发送GET请求：
axios.get("http://yapi.smart-xwork.cn/mock/169327/emp/list").then((result) => {
    console.log(result.data);
});

2.发送POST请求：
axios.post("http://yapi.smart-xwork.cn/mock/169327/emp/deleteById","id=1").then((result) => {
    console.log(result.data);
});

</code></pre> 
  <p>                         案例：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/054003f7b2eb465d9c72637adff9c7b0.jpg" target="_blank"><img alt="JavaWeb_第6张图片" height="305" src="http://img.e-com-net.com/image/info8/054003f7b2eb465d9c72637adff9c7b0.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        代码： </p> 
  <pre><code class="language-html"><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ajax-Axios-案例</title>
    <script src="js/axios-0.18.0.js"></script>
    <script src="js/vue.js"></script>
</head>
<body>
    <div id="app">
        <table border="1" cellspacing="0" width="60%">
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>图像</th>
                <th>性别</th>
                <th>职位</th>
                <th>入职日期</th>
                <th>最后操作时间</th>
            </tr>

            <tr align="center" v-for="(emp,index) in emps">
                <td>{{index + 1}}</td>
                <td>{{emp.name}}</td>
                <td>
                    <img v-bind:src="emp.image" width="70px" height="50px">
                </td>
                <td>
                    <span >{{emp.gender == 1? '男' : '女'}}</span>
                </td>
                <td>{{emp.job}}</td>
                <td>{{emp.entrydate}}</td>
                <td>{{emp.updatetime}}</td>
            </tr>
        </table>
    </div>
</body>
<script>
    new Vue({
        el:"#app",
        data:{
            emps:[]
        },
        mounted() {
            axios.get("https://yapi.pro/mock/49252/emp/list").then(result=>{
                this.emps = result.data.data;
            })
        },
    })
</script>
</html></code></pre> 
  <p></p> 
  <h3 id="18.%E5%89%8D%E5%90%8E%E7%AB%AF%E5%88%86%E7%A6%BB%E5%BC%80%E5%8F%91%EF%BC%9A%C2%A0">18.前后端分离开发： </h3> 
  <p><a href="http://img.e-com-net.com/image/info8/f1e1b7d77b63479994770864bf632beb.jpg" target="_blank"><img alt="JavaWeb_第7张图片" height="331" src="http://img.e-com-net.com/image/info8/f1e1b7d77b63479994770864bf632beb.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="19.YApi%C2%A0">19.YApi </h3> 
  <p>        （1）介绍： </p> 
  <p>                        介绍：YApi 是高效、易用、功能强大的 api 管理平台，旨在为开发、产品、测试人员提供更优雅的接口管理服务 </p> 
  <p>        （2）步骤： </p> 
  <p>                        1.添加项目 </p> 
  <p>                        2.添加分类 </p> 
  <p>                        3.添加接口 </p> 
  <p></p> 
  <h3 id="20.%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%8C%96%C2%A0">20.前端工程化 </h3> 
  <p>        （1）介绍： </p> 
  <p>                        前端工程化：是指在企业级的前端项目开发中，把前端开发所需的工具、技术、流程、经验等进行规范化、标准化 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/12c6e650606d4fb0880e287d583c2305.jpg" target="_blank"><img alt="JavaWeb_第8张图片" height="421" src="http://img.e-com-net.com/image/info8/12c6e650606d4fb0880e287d583c2305.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （2）环境准备： </p> 
  <p>                        vue-cli：</p> 
  <p>                                1.介绍： </p> 
  <p>                                        Vue-cli 是Vue官方提供的一个脚手架，用于快速生成一个 Vue 的项目模板 </p> 
  <p>                                 2.Vue-cli提供了如下功能：</p> 
  <p>                                        统一的目录结构 </p> 
  <p>                                         本地调试</p> 
  <p>                                        热部署 </p> 
  <p>                                        单元测试 </p> 
  <p>                                        集成打包上线 </p> 
  <p>                                依赖环境：NodeJS  </p> 
  <p>        （3）安装NodeJS：          </p> 
  <p>                        1.双击安装包： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/cb5eb41057ba4ffea39c98da69a4aee7.jpg" target="_blank"><img alt="JavaWeb_第9张图片" height="507" src="http://img.e-com-net.com/image/info8/cb5eb41057ba4ffea39c98da69a4aee7.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/533cfc39e5cc4877a77d7e580ac3915a.jpg" target="_blank"><img alt="JavaWeb_第10张图片" height="255" src="http://img.e-com-net.com/image/info8/533cfc39e5cc4877a77d7e580ac3915a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        2.选择安装目录： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/d80ee27b5a0e450fb1dc59237d56e47a.jpg" target="_blank"><img alt="JavaWeb_第11张图片" height="255" src="http://img.e-com-net.com/image/info8/d80ee27b5a0e450fb1dc59237d56e47a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/f3b4024c8ac64c5ca1ae0059525e800b.jpg" target="_blank"><img alt="JavaWeb_第12张图片" height="188" src="http://img.e-com-net.com/image/info8/f3b4024c8ac64c5ca1ae0059525e800b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        3.验证NodeJS环境变量： </p> 
  <p>                                NodeJS 安装完毕后，会自动配置好环境变量，我们验证一下是否安装成功，通过： node -v  </p> 
  <p><a href="http://img.e-com-net.com/image/info8/e3d5c17d65c941beb31414375372f623.jpg" target="_blank"><img alt="JavaWeb_第13张图片" height="252" src="http://img.e-com-net.com/image/info8/e3d5c17d65c941beb31414375372f623.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        4.配置npm的全局装路径： </p> 
  <p>                                使用管理员身份运行命令行，在命令行中，执行如下指令 :                               </p> 
  <pre><code class="language-javascript">npm config set prefix "E:\develop\NodeJS"

注意：E:\develop\NodeJS 这个目录是NodeJS的安装目录</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/ba0da103c16e46179ad3969d8cdcc6c7.jpg" target="_blank"><img alt="JavaWeb_第14张图片" height="522" src="http://img.e-com-net.com/image/info8/ba0da103c16e46179ad3969d8cdcc6c7.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        5.切换npm的淘宝镜像： </p> 
  <p>                                使用管理员身份运行命令行，在命令行中，执行如下指令 ： </p> 
  <pre><code class="language-javascript">npm config set registry https://registry.npm.taobao.org</code></pre> 
  <p>                        6.安装vue.cli: </p> 
  <p>                                使用管理员身份运行命令行，在命令行中，执行如下指令 : </p> 
  <pre><code class="language-javascript">npm install -g @vue/cli

这个过程中，会联网下载，可能会耗时几分钟，耐心等待</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/b3a247cca17f43e8811b9f677f6ab423.jpg" target="_blank"><img alt="JavaWeb_第15张图片" height="275" src="http://img.e-com-net.com/image/info8/b3a247cca17f43e8811b9f677f6ab423.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （4）Vue项目-创建： </p> 
  <p>                        命令行： </p> 
  <pre><code class="language-javascript">vue create vue-project01</code></pre> 
  <p>                        图形化界面： </p> 
  <pre><code class="language-javascript">vue ui</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/8747f4de6a2a40489ab66affb1d1cece.jpg" target="_blank"><img alt="JavaWeb_第16张图片" height="211" src="http://img.e-com-net.com/image/info8/8747f4de6a2a40489ab66affb1d1cece.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （5）Vue项目-目录结构： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/060589caf8154c67bcdb8f28152d6bc3.jpg" target="_blank"><img alt="JavaWeb_第17张图片" height="345" src="http://img.e-com-net.com/image/info8/060589caf8154c67bcdb8f28152d6bc3.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （6）Vue项目-启动：  </p> 
  <p>                        1.方式一：图形化界面 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/be565a8f41a64124ad543849f7cf04c7.jpg" target="_blank"><img alt="JavaWeb_第18张图片" height="592" src="http://img.e-com-net.com/image/info8/be565a8f41a64124ad543849f7cf04c7.jpg" width="359" style="border:1px solid black;"></a></p> 
  <p>                        2.命令行：npm run serve </p> 
  <p><a href="http://img.e-com-net.com/image/info8/1354ffd0e8a743b6bcd8a4c6837d1465.jpg" target="_blank"><img alt="JavaWeb_第19张图片" height="413" src="http://img.e-com-net.com/image/info8/1354ffd0e8a743b6bcd8a4c6837d1465.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （7）Vue项目-配置端口： </p> 
  <pre><code class="language-javascript">const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    port: 7000,
  }
})
</code></pre> 
  <p>        （8）Vue项目开发流程： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/59da59e3ccb14f8b86d382d8b60f71ed.jpg" target="_blank"><img alt="JavaWeb_第20张图片" height="321" src="http://img.e-com-net.com/image/info8/59da59e3ccb14f8b86d382d8b60f71ed.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="21.Vue%E7%BB%84%E4%BB%B6%E5%BA%93Element%C2%A0">21.Vue组件库Element </h3> 
  <p>        （1）element介绍： </p> 
  <p>                        Element：是饿了么团队研发的，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库 </p> 
  <p>                        组件：组成网页的部件，例如 超链接、按钮、图片、表格、表单、分页条等等 </p> 
  <p>                        官网：https://element.eleme.cn/#/zh-CNListener </p> 
  <p>        （2）快速入门： </p> 
  <p>                        1.安装ElementUI组件库 （在当前工程的目录下），在命令行执行指令： </p> 
  <pre><code class="language-javascript">npm install element-ui@2.15.3 </code></pre> 
  <p>                        2.引入ElementUI组件库： </p> 
  <pre><code class="language-javascript">import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
</code></pre> 
  <p>                        3.访问官网，复制组件代码，调整 </p> 
  <p>        （3）Vue项目中使用Axios： </p> 
  <p>                        在项目目录下安装axios： </p> 
  <pre><code class="language-javascript">npm  install axios;</code></pre> 
  <p>                        需要使用axios时，导入axios： </p> 
  <pre><code class="language-javascript">import axios from 'axios';</code></pre> 
  <p>        （4）Vue路由： </p> 
  <p>                        前端路由: URL中的hash(#号) 与组件之间的对应关系 </p> 
  <p>                （1）介绍： </p> 
  <p>                                 Vue Router 是 Vue 的官方路由 </p> 
  <p>                （2）组成： </p> 
  <p>                                 VueRouter：路由器类，根据路由请求在路由视图中动态渲染选中的组件</p> 
  <p>                                <router-link>：请求链接组件，浏览器会解析成<a> </p> 
  <p>                                <router-view>：动态视图组件，用来渲染展示与路由路径对应的组件 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/c690743a602544869c2d5ea89f2aba8d.jpg" target="_blank"><img alt="JavaWeb_第21张图片" height="281" src="http://img.e-com-net.com/image/info8/c690743a602544869c2d5ea89f2aba8d.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （3）安装：(创建Vue项目时已选择)               </p> 
  <pre><code class="language-javascript">npm install vue-router@3.5.1
</code></pre> 
  <p>        （4）定义路由： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/958590a170b24d878d6494902861b22d.jpg" target="_blank"><img alt="JavaWeb_第22张图片" height="245" src="http://img.e-com-net.com/image/info8/958590a170b24d878d6494902861b22d.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>       </p> 
  <h3 id="22.%E6%89%93%E5%8C%85%E9%83%A8%E7%BD%B2%C2%A0">22.打包部署 </h3> 
  <p>        （1）打包： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/3c58f02721ad417aafd4d05d481d9bfc.jpg" target="_blank"><img alt="JavaWeb_第23张图片" height="310" src="http://img.e-com-net.com/image/info8/3c58f02721ad417aafd4d05d481d9bfc.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （2）部署： </p> 
  <p>                Nginx： </p> 
  <p>                        介绍：</p> 
  <p>                                Nginx是一款轻量级的Web服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器。其特点是占有内存少，并发能力强，在各大型互联网公司都有非常广泛的使用 </p> 
  <p>                                官网：https://nginx.org/ </p> 
  <p><a href="http://img.e-com-net.com/image/info8/bffdb38f184043b3b92f227c2d595946.jpg" target="_blank"><img alt="JavaWeb_第24张图片" height="246" src="http://img.e-com-net.com/image/info8/bffdb38f184043b3b92f227c2d595946.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        部署：</p> 
  <p>                                将打包好的 dist 目录下的文件，复制到nginx安装目录的html目录下 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/2698724e55f34b64919796e9acbec82b.jpg" target="_blank"><img alt="JavaWeb_第25张图片" height="233" src="http://img.e-com-net.com/image/info8/2698724e55f34b64919796e9acbec82b.jpg" width="504" style="border:1px solid black;"></a></p> 
  <p>                        启动：</p> 
  <p>                                双击 nginx.exe 文件即可，Nginx服务器默认占用 80 端口号 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/3ac88a88fac84f209b23aa6ee4d1a99e.jpg" target="_blank"><img alt="JavaWeb_第26张图片" height="287" src="http://img.e-com-net.com/image/info8/3ac88a88fac84f209b23aa6ee4d1a99e.jpg" width="513" style="border:1px solid black;"></a></p> 
  <p>                      <span style="color:#fe2c24;">  注意：</span></p> 
  <p><span style="color:#fe2c24;">                                Nginx默认占用80端口号，如果80端口号被占用，可以在nginx.conf中修改端口号。(netstat –ano | findStr  80) </span></p> 
  <p></p> 
  <h3 id="23.Maven%C2%A0">23.Maven </h3> 
  <p>        （1）介绍：  </p> 
  <p>                       <span style="color:#fe2c24;">Apache Maven 是一个项目管理和构建工具，它基于项目对象模型(POM)的概念，通过一小段描述信息来管理项目的构建</span></p> 
  <p>                        <span style="color:#38d8f0;">官网：</span>Maven – Welcome to Apache Maven</p> 
  <p><span style="color:#fe2c24;">                        Apache 软件基金会，成立于1999年7月，是目前世界上最大的最受欢迎的开源软件基金会，也是一个专门为支持开源项目而生的非盈利性组织 </span></p> 
  <p>                        <span style="color:#38d8f0;">开源项目：</span>https://www.apache.org/index.html#projects-list</p> 
  <p>        （2）Maven的作用： </p> 
  <p>                        1.依赖管理： </p> 
  <p>                                方便快捷的管理项目依赖的资源(jar包)，避免版本冲突问题 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/81123ecf54fa4bdba143b16f9e301dec.jpg" target="_blank"><img alt="JavaWeb_第27张图片" height="587" src="http://img.e-com-net.com/image/info8/81123ecf54fa4bdba143b16f9e301dec.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        2.统一项目结构： </p> 
  <p>                                提供标准、统一的项目结构 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/eab59120a91f42cbaeabf174caf6783c.jpg" target="_blank"><img alt="JavaWeb_第28张图片" height="356" src="http://img.e-com-net.com/image/info8/eab59120a91f42cbaeabf174caf6783c.jpg" width="506" style="border:1px solid black;"></a></p> 
  <p>                        3.项目构建： </p> 
  <p>                                标准跨平台（Linux、Windows、MacOS）的自动化项目构建方式 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/b332f6f3f986497d8ee77bfa64ab21dd.jpg" target="_blank"><img alt="JavaWeb_第29张图片" height="257" src="http://img.e-com-net.com/image/info8/b332f6f3f986497d8ee77bfa64ab21dd.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/f3b9681e306e4d8ea623a461a799eaf7.jpg" target="_blank"><img alt="JavaWeb_第30张图片" height="233" src="http://img.e-com-net.com/image/info8/f3b9681e306e4d8ea623a461a799eaf7.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                <span style="color:#38d8f0;">仓库：用于存储资源，管理各种jar包 </span></p> 
  <p><span style="color:#38d8f0;">                                本地仓库：自己计算机上的一个目录 </span></p> 
  <p><span style="color:#38d8f0;">                                中央仓库：由Maven团队维护的全球唯一的。 仓库地址：https://repo1.maven.org/maven2/ </span></p> 
  <p><span style="color:#38d8f0;">                                远程仓库(私服)：一般由公司团队搭建的私有仓库 </span></p> 
  <p>        （3）Maven安装： </p> 
  <p>                        安装步骤： </p> 
  <p>                                1.下载Maven:  </p> 
  <p>                                        官网：Maven – Download Apache Maven          </p> 
  <p>                                        目前最新版：apache-maven-3.9.6-bin.zip        点击进行下载即可       <a href="http://img.e-com-net.com/image/info8/69b44c0773a14ceb87584f19b027d670.jpg" target="_blank"><img alt="JavaWeb_第31张图片" height="152" src="http://img.e-com-net.com/image/info8/69b44c0773a14ceb87584f19b027d670.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                2.解压 ：</p> 
  <p>                                        我这里用的版本是：apache-maven-3.6.1-bin.zip </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/0952fd67261d44daa88f3fdc6826da49.jpg" target="_blank"><img alt="" height="65" src="http://img.e-com-net.com/image/info8/0952fd67261d44daa88f3fdc6826da49.jpg" width="387"></a></p> 
  <p>                                3.配置本地仓库：</p> 
  <p>                                        修改 conf/settings.xml 中的 <localRepository> 为一个指定目录 ：</p> 
  <pre><code class="language-java"><localRepository>E:\develop\apache-maven-3.6.1\mvn_repo</localRepository>
</code></pre> 
  <p>                                4.配置阿里云私服：</p> 
  <p>                                        修改 conf/settings.xml 中的 <mirrors>标签，为其添加如下子标签 ：</p> 
  <pre><code class="language-java"><mirror>  
    <id>alimaven</id>  
    <name>aliyun maven</name>  
    <url>http://maven.aliyun.com/nexus/content/groups/public/</url>
    <mirrorOf>central</mirrorOf>          
</mirror>
</code></pre> 
  <p>                                5.配置环境变量:</p> 
  <p>                                        MAVEN_HOME 为maven的解压目录，并将其bin目录加入PATH环境变量 </p> 
  <p>                                6.检查安装是否成功：                                    </p> 
  <pre><code class="language-java">win + r cmd 敲回车

输入：mvn -v

出现如下界面说明安装成功：</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/8f974ab997de409daf0acd676244a414.jpg" target="_blank"><img alt="JavaWeb_第32张图片" height="198" src="http://img.e-com-net.com/image/info8/8f974ab997de409daf0acd676244a414.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （4）配置Maven环境(当前工程)： </p> 
  <p>                        1.选择 IDEA中 File --> Settings --> Build,Execution,Deployment --> Build Tools --> Maven ：</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/bdd8c4cb10f5417f827b25a31e49892d.jpg" target="_blank"><img alt="JavaWeb_第33张图片" height="715" src="http://img.e-com-net.com/image/info8/bdd8c4cb10f5417f827b25a31e49892d.jpg" width="458" style="border:1px solid black;"></a></p> 
  <p></p> 
  <p>                          2.设置 IDEA 使用本地安装的 Maven，并修改配置文件及本地仓库路径 ： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/22614d9ecd6c48b487be57d30606c5eb.jpg" target="_blank"><img alt="JavaWeb_第34张图片" height="498" src="http://img.e-com-net.com/image/info8/22614d9ecd6c48b487be57d30606c5eb.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （5）IDEA 创建 Maven 项目： </p> 
  <p>                        1.打开 IDEA 点击 new project 选择 empty project </p> 
  <p><a href="http://img.e-com-net.com/image/info8/187f1c309d2740b29f555518288f8bf7.jpg" target="_blank"><img alt="JavaWeb_第35张图片" height="163" src="http://img.e-com-net.com/image/info8/187f1c309d2740b29f555518288f8bf7.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/f146084bdc2b4ee199b7a837257f85c2.jpg" target="_blank"><img alt="JavaWeb_第36张图片" height="621" src="http://img.e-com-net.com/image/info8/f146084bdc2b4ee199b7a837257f85c2.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        2.点击 file ，点击 Project Structure ：</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" target="_blank"><img alt="JavaWeb_第37张图片" height="713" src="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" width="449" style="border:1px solid black;"></a></p> 
  <p>                        3. 点击 Modules ，点击 + 号 ，点击 New Module：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/cbc11a293d7940be800d5be093e8f75f.jpg" target="_blank"><img alt="JavaWeb_第38张图片" height="475" src="http://img.e-com-net.com/image/info8/cbc11a293d7940be800d5be093e8f75f.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        4.点击 create 创建完成：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/bb800cb2bd9c43ba88a22dce20f4c5fa.jpg" target="_blank"><img alt="JavaWeb_第39张图片" height="529" src="http://img.e-com-net.com/image/info8/bb800cb2bd9c43ba88a22dce20f4c5fa.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （6）Maven坐标： </p> 
  <p>                        <span style="color:#fe2c24;">Maven 中的坐标是资源的唯一标识，通过该坐标可以唯一定位资源位置</span> 。</p> 
  <p>                        <span style="color:#fe2c24;">使用坐标来定义项目或引入项目中需要的依赖 。</span></p> 
  <p>        （7）Maven 坐标主要组成： </p> 
  <p>                        <span style="color:#38d8f0;">groupId：定义当前Maven项目隶属组织名称（通常是域名反写，例如：com.itheima） </span></p> 
  <p><span style="color:#38d8f0;">                        artifactId：定义当前Maven项目名称（通常是模块名称，例如 order-service、goods-service） </span></p> 
  <p><span style="color:#38d8f0;">                        version：定义当前项目版本号 </span></p> 
  <pre><code class="language-java">例：
<dependency>
    <groupId>ch.qos.logback</groupId>    
    <artifactId>logback-classic</artifactId>    
    <version>1.2.3</version>
</dependency>
</code></pre> 
  <p>        （8）IDEA 导入 Maven 项目： </p> 
  <p>                        方式一：打开IDEA，选择右侧Maven面板，点击 + 号，选中对应项目的pom.xml文件，双击即可： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/91d838f2acd34080a01ae5da01f22672.jpg" target="_blank"><img alt="JavaWeb_第40张图片" height="562" src="http://img.e-com-net.com/image/info8/91d838f2acd34080a01ae5da01f22672.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        方式二：打开IDEA，点击 file ，点击 project structure，然后点击 modules，点击 + 号 ，点击 import module ,选择 pom.xml 文件，点击 ok 即可： </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" target="_blank"><img alt="JavaWeb_第41张图片" height="713" src="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" width="449" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/6b281361909448e98d6135d68bd41e51.jpg" target="_blank"><img alt="JavaWeb_第42张图片" height="475" src="http://img.e-com-net.com/image/info8/6b281361909448e98d6135d68bd41e51.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/c8184b1c6c1c43f4be59f2d7f513d3c1.jpg" target="_blank"><img alt="JavaWeb_第43张图片" height="539" src="http://img.e-com-net.com/image/info8/c8184b1c6c1c43f4be59f2d7f513d3c1.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （9）依赖配置： </p> 
  <p>                        依赖：指当前项目运行所需要的jar包，一个项目中可以引入多个依赖 </p> 
  <p>                        配置： </p> 
  <p>                               <span style="color:#38d8f0;"> 1.在 pom.xml 中编写 <dependencies> 标签 </span></p> 
  <p><span style="color:#38d8f0;">                                2.在 <dependencies> 标签中 使用 <dependency> 引入坐标 </span></p> 
  <p><span style="color:#38d8f0;">                                3.定义坐标的 groupId，artifactId，version </span></p> 
  <p><span style="color:#38d8f0;">                                4.点击刷新按钮，引入最新加入的坐标 </span></p> 
  <pre><code class="language-java"><dependencies>
    <dependency>        
        <groupId>ch.qos.logback</groupId>        
        <artifactId>logback-classic</artifactId>        
        <version>1.2.3</version>    
    </dependency>
</dependencies></code></pre> 
  <p>                       <span style="color:#fe2c24;"> 注意： </span></p> 
  <p><span style="color:#fe2c24;">                                如果引入的依赖，在本地仓库不存在，将会连接远程仓库/中央仓库，然后下载依赖。（这个过程会比较耗时，耐心等待） </span></p> 
  <p>                        如果不知道依赖的坐标信息，可以到以下网址中进行搜索：<br>                                https://mvnrepository.com/</p> 
  <p>        （10）依赖传递： </p> 
  <p>                        依赖具有传递性： </p> 
  <p>                                 直接依赖：在当前项目中通过依赖配置建立的依赖关系</p> 
  <p>                                间接依赖：被依赖的资源如果依赖其他资源，当前项目间接依赖其他资源 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/e5b22af685cc40ae9b2b077eb1c058c8.jpg" target="_blank"><img alt="JavaWeb_第44张图片" height="300" src="http://img.e-com-net.com/image/info8/e5b22af685cc40ae9b2b077eb1c058c8.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        排除依赖： </p> 
  <p>                                排除依赖指主动断开依赖的资源，被排除的资源无需指定版本 </p> 
  <pre><code class="language-java"><dependency>    
    <groupId>com.itheima</groupId>    
    <artifactId>maven-projectB</artifactId>    
    <version>1.0-SNAPSHOT</version>  
        排除依赖：  
        <exclusions>        
            <exclusion>            
            <groupId>junit</groupId>            
            <artifactId>junit</artifactId>        
            </exclusion>    
        </exclusions>
</dependency>
</code></pre> 
  <p>        （11）依赖范围： </p> 
  <p>                        依赖的jar包，默认情况下，可以在任何地方使用。可以通过 <scope>…</ scope > 设置其作用范围 </p> 
  <p>                        作用范围： </p> 
  <p>                                主程序范围有效。（main文件夹范围内） </p> 
  <p>                                测试程序范围有效。（test文件夹范围内） </p> 
  <p>                                是否参与打包运行。（package指令范围内） </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/940be297c9c7469d8f55adc0e605e62d.jpg" target="_blank"><img alt="JavaWeb_第45张图片" height="249" src="http://img.e-com-net.com/image/info8/940be297c9c7469d8f55adc0e605e62d.jpg" width="282" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/f267e440d1a64bd0a5ecad1887afa349.jpg" target="_blank"><img alt="JavaWeb_第46张图片" height="200" src="http://img.e-com-net.com/image/info8/f267e440d1a64bd0a5ecad1887afa349.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （12）Maven生命周期： </p> 
  <p>                        Maven的生命周期就是为了对所有的maven项目构建过程进行抽象和统一 </p> 
  <p>                        Maven中有3套相互独立的生命周期： </p> 
  <p>                                1.clean：清理工作 </p> 
  <p>                                2.default：核心工作，如：编译、测试、打包、安装、部署等 </p> 
  <p>                                3.site：生成报告、发布站点等 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/feb8ac84fd8041a689538efaeede7c33.jpg" target="_blank"><img alt="JavaWeb_第47张图片" height="140" src="http://img.e-com-net.com/image/info8/feb8ac84fd8041a689538efaeede7c33.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        <span style="color:#38d8f0;">每套生命周期包含一些阶段（phase），阶段是有顺序的，后面的阶段依赖于前面的阶段 </span></p> 
  <p> <a href="http://img.e-com-net.com/image/info8/587c2364dae94326b3b3b9901fb33b49.jpg" target="_blank"><img alt="JavaWeb_第48张图片" height="313" src="http://img.e-com-net.com/image/info8/587c2364dae94326b3b3b9901fb33b49.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        生命周期阶段： </p> 
  <p>                                clean：移除上一次构建生成的文件 </p> 
  <p>                                compile：编译项目源代码 </p> 
  <p>                                test：使用合适的单元测试框架运行测试(junit) </p> 
  <p>                                package：将编译后的文件打包，如：jar、war等 </p> 
  <p>                                install：安装项目到本地仓库 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/6e8495cc1cd24c5887737f53eb42bfe1.jpg" target="_blank"><img alt="JavaWeb_第49张图片" height="377" src="http://img.e-com-net.com/image/info8/6e8495cc1cd24c5887737f53eb42bfe1.jpg" width="352" style="border:1px solid black;"></a></p> 
  <p>                       <span style="color:#fe2c24;"> 注意： </span></p> 
  <p><span style="color:#fe2c24;">                                在同一套生命周期中，当运行后面的阶段时，前面的阶段都会运行 </span></p> 
  <p>                        执行指定生命周期的两种方式： </p> 
  <p>                                1.在idea中，右侧的maven工具栏，选中对应的生命周期，双击执行 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/6e8495cc1cd24c5887737f53eb42bfe1.jpg" target="_blank"><img alt="JavaWeb_第50张图片" height="377" src="http://img.e-com-net.com/image/info8/6e8495cc1cd24c5887737f53eb42bfe1.jpg" width="352" style="border:1px solid black;"></a></p> 
  <p>                                2.在命令行中，通过命令执行 </p> 
  <pre><code class="language-java">mvn clean
mvn compile
mvn test
mvn package
mvn install
</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/4ebd31b00dae494192c8b6b1e5d1fdef.jpg" target="_blank"><img alt="JavaWeb_第51张图片" height="297" src="http://img.e-com-net.com/image/info8/4ebd31b00dae494192c8b6b1e5d1fdef.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/9a4cbd0233f44dfaae4a873a502b23c5.jpg" target="_blank"><img alt="JavaWeb_第52张图片" height="316" src="http://img.e-com-net.com/image/info8/9a4cbd0233f44dfaae4a873a502b23c5.jpg" width="650" style="border:1px solid black;"></a></p> 
  <pre><code class="language-java">Maven生命周期：

    clean：清理
    compile：编译
    test：测试
    package：打包
    install：安装
</code></pre> 
  <p></p> 
  <h3 id="24.Springboot%E5%BF%AB%E9%80%9F%E5%85%A5%E9%97%A8%C2%A0">24.Springboot快速入门 </h3> 
  <p>        （1） Spring介绍：</p> 
  <p>                        官网：Spring | Home </p> 
  <p>                        Spring发展到今天已经形成了一种开发生态圈，Spring提供了若干个子项目，每个项目用于完成特定的功能 </p> 
  <p>        （2）Springboot:： </p> 
  <p>                        Spring Boot 可以帮助我们非常快速的构建应用程序、简化开发、提高效率 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/8598a2d7794e421f83a5bcb9b32b8731.jpg" target="_blank"><img alt="JavaWeb_第53张图片" height="294" src="http://img.e-com-net.com/image/info8/8598a2d7794e421f83a5bcb9b32b8731.jpg" width="626" style="border:1px solid black;"></a></p> 
  <p>        （3）SpringBootWeb快速入门：        <a href="http://img.e-com-net.com/image/info8/8c00c0f2545a42a89b59112ac60bb45a.jpg" target="_blank"><img alt="JavaWeb_第54张图片" height="169" src="http://img.e-com-net.com/image/info8/8c00c0f2545a42a89b59112ac60bb45a.jpg" width="650" style="border:1px solid black;"></a> </p> 
  <p>                        步骤： </p> 
  <p>                                1.创建springboot工程，并勾选web开发相关依赖</p> 
  <p>                                        - 打开IDEA，点击 file ，点击 project structure</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" target="_blank"><img alt="JavaWeb_第55张图片" height="713" src="http://img.e-com-net.com/image/info8/95e106bb758c4f1dac3cf3ac78aab6d2.jpg" width="449" style="border:1px solid black;"></a></p> 
  <p>                                          然后点击 modules，点击 + 号，点击 new module  ，选择 Spring lnitializr，点击 next</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/86827fff1bf74ee1bfaaedc080f57d3f.jpg" target="_blank"><img alt="JavaWeb_第56张图片" height="528" src="http://img.e-com-net.com/image/info8/86827fff1bf74ee1bfaaedc080f57d3f.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                       选择 spring web，点击 create，完成创建</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/6cbf7711348f4e8cb6db561e49270b4a.jpg" target="_blank"><img alt="JavaWeb_第57张图片" height="528" src="http://img.e-com-net.com/image/info8/6cbf7711348f4e8cb6db561e49270b4a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                2.创建一个包：controller，在包下创建一个类：HelloController，在类上添加注解：@RestController，在类中编写一个方法，在方法上方添加一个注解：@RequestMapping("/hello")</p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/73919caa73a7409b80ef42388df7e95a.jpg" target="_blank"><img alt="JavaWeb_第58张图片" height="217" src="http://img.e-com-net.com/image/info8/73919caa73a7409b80ef42388df7e95a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <pre><code class="language-java">@RestController
public class HelloController {
    @RequestMapping("/hello")
    public String Hello(){
        return "Hello Springboot";
    }
}
</code></pre> 
  <p>                                3.运行测试：运行启动类，打开浏览器，在地址栏输入：localhost:8080/hello</p> 
  <p>进行访问 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/bd9a7f9cc16e431e8ac1056dec6a1d5d.jpg" target="_blank"><img alt="JavaWeb_第59张图片" height="288" src="http://img.e-com-net.com/image/info8/bd9a7f9cc16e431e8ac1056dec6a1d5d.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                运行成功如图： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/1b33cc1238fe42499371c0a4952d1afa.jpg" target="_blank"><img alt="JavaWeb_第60张图片" height="144" src="http://img.e-com-net.com/image/info8/1b33cc1238fe42499371c0a4952d1afa.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="25.HTTP%E5%8D%8F%E8%AE%AE%C2%A0">25.HTTP协议 </h3> 
  <p>        （1）HTTP-概述： </p> 
  <p>                        概念：Hyper Text Transfer Protocol，超文本传输协议，规定了浏览器和服务器之间数据传输的规则 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/8106c9f948b04d7a94842e798e3c3fd2.jpg" target="_blank"><img alt="JavaWeb_第61张图片" height="139" src="http://img.e-com-net.com/image/info8/8106c9f948b04d7a94842e798e3c3fd2.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                      <span style="color:#fe2c24;">  特点： </span></p> 
  <p><span style="color:#fe2c24;">                                1.基于TCP协议：面向连接，安全 </span></p> 
  <p><span style="color:#fe2c24;">                                2.基于请求-响应模型的：一次请求对应一次响应 </span></p> 
  <p><span style="color:#fe2c24;">                                3.HTTP协议是无状态的协议：对于事务处理没有记忆能力。每次请求-响应都是独立的 </span></p> 
  <p><span style="color:#fe2c24;">                        缺点：多次请求间不能共享数据 </span></p> 
  <p><span style="color:#fe2c24;">                        优点：速度快 </span></p> 
  <p>        （2）HTTP-请求数据格式： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/e5d7f422f8174d598123082e08ffc9f2.jpg" target="_blank"><img alt="JavaWeb_第62张图片" height="321" src="http://img.e-com-net.com/image/info8/e5d7f422f8174d598123082e08ffc9f2.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/4180154a6f654d89bca60f0882912d99.jpg" target="_blank"><img alt="JavaWeb_第63张图片" height="230" src="http://img.e-com-net.com/image/info8/4180154a6f654d89bca60f0882912d99.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （3）HTTP响应格式： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/422a1db350524757a3f905dfbc1ff011.jpg" target="_blank"><img alt="JavaWeb_第64张图片" height="256" src="http://img.e-com-net.com/image/info8/422a1db350524757a3f905dfbc1ff011.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/d18a898a8864402fa49614d96e95fa59.jpg" target="_blank"><img alt="JavaWeb_第65张图片" height="334" src="http://img.e-com-net.com/image/info8/d18a898a8864402fa49614d96e95fa59.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="26.Web%E6%9C%8D%E5%8A%A1%E5%99%A8-Tomcat">26.Web服务器-Tomcat</h3> 
  <p>                Web服务器是一个软件程序，对HTTP协议的操作进行封装，使得程序员不必直接对协议进行操作，让Web开发更加便捷。主要功能是 "提供网上信息浏览服务 </p> 
  <p>        （1） Tomcat-简介：</p> 
  <p>                        Tomcat是Apache 软件基金会一个核心项目，是一个开源免费的轻量级Web服务器，支持Servlet/JSP少量JavaEE规范 </p> 
  <p>                        JavaEE：Java Enterprise Edition，Java企业版。指Java企业级开发的技术规范总和。包含13项技术规范：JDBC、JNDI、EJB、RMI、JSP、Servlet、XML、JMS、Java IDL、JTS、JTA、JavaMail、JAF </p> 
  <p>                        Tomcat 也被称为 Web容器、Servlet容器。Servlet程序需要依赖于 Tomcat才能运行 </p> 
  <p>                        官网： Apache Tomcat® - Welcome!</p> 
  <p><a href="http://img.e-com-net.com/image/info8/947b3dcc7a0641bab9529dd284e8644b.jpg" target="_blank"><img alt="JavaWeb_第66张图片" height="340" src="http://img.e-com-net.com/image/info8/947b3dcc7a0641bab9529dd284e8644b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （2）Tomcat-基本使用： </p> 
  <p>                   1.下载：官网下载，地址 ：Apache Tomcat® - Apache Tomcat 9 Software Downloads</p> 
  <p>                   2.安装：绿色版，直接解压即可 </p> 
  <p>                   3.卸载：直接删除目录即可 </p> 
  <p>                   4.启动：双击：bin\startup.bat </p> 
  <p>                        <span style="color:#fe2c24;">解决控制台中文乱码问题：修改conf/ logging.properties </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/70b26e89b6f740588149b1660e79ac94.jpg" target="_blank"><img alt="" height="96" src="http://img.e-com-net.com/image/info8/70b26e89b6f740588149b1660e79ac94.jpg" width="650"></a>​ </p> 
  <p>                  5. 关闭：</p> 
  <p>                        （1）直接×掉运行窗口：强制关闭 </p> 
  <p>                        （2）bin\shutdown.bat：正常关闭 </p> 
  <p>                        （3）Ctrl+C：正常关闭 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/17fa48d496c14e29b181b433688297de.jpg" target="_blank"><img alt="JavaWeb_第67张图片" height="543" src="http://img.e-com-net.com/image/info8/17fa48d496c14e29b181b433688297de.jpg" width="416" style="border:1px solid black;"></a></p> 
  <p>        （3）常见问题： </p> 
  <p>                        1.启动窗口一闪而过：检查JAVA_HOME环境变量是否正确配置 </p> 
  <p>                        2.端口号冲突：找到对应程序，将其关闭掉 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/fc7f4c2ec4cf495ab9e1c0902b0dcf88.jpg" target="_blank"><img alt="JavaWeb_第68张图片" height="118" src="http://img.e-com-net.com/image/info8/fc7f4c2ec4cf495ab9e1c0902b0dcf88.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （4）配置Tomcat端口号（conf/server.xml）： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/d5a21d1fc12d4e769faf8015d7ab7589.jpg" target="_blank"><img alt="" height="87" src="http://img.e-com-net.com/image/info8/d5a21d1fc12d4e769faf8015d7ab7589.jpg" width="638"></a></p> 
  <p>                注意： </p> 
  <p>                       <span style="color:#38d8f0;"> HTTP协议默认端口号为80，如果将Tomcat端口号改为80，则将来访问Tomcat时，将不用输入端口号 </span></p> 
  <p>        （5）Tomcat 部署项目： </p> 
  <p>                       <span style="color:#fe2c24;"> 将项目放置到 webapps 目录下， 即部署完成 </span></p> 
  <p></p> 
  <h3 id="27.%E8%AF%B7%E6%B1%82%E5%93%8D%E5%BA%94%C2%A0">27.请求响应 </h3> 
  <p>    <a href="http://img.e-com-net.com/image/info8/e527d8bfbff64e6393b2365deb6dad47.jpg" target="_blank"><img alt="JavaWeb_第69张图片" height="324" src="http://img.e-com-net.com/image/info8/e527d8bfbff64e6393b2365deb6dad47.jpg" width="650" style="border:1px solid black;"></a> </p> 
  <p>        （1）请求： </p> 
  <p>                        1.postman </p> 
  <p>                                Postman是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件 </p> 
  <p>                                作用：常用于进行接口测试 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/3764334479b749a4b8b605295cc42594.jpg" target="_blank"><img alt="JavaWeb_第70张图片" height="280" src="http://img.e-com-net.com/image/info8/3764334479b749a4b8b605295cc42594.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        2.简单参数： </p> 
  <p>                                原始方式： </p> 
  <p>                                        在原始的web程序中，获取请求参数，需要通过HttpServletRequest 对象手动获取 </p> 
  <pre><code class="language-java">@RequestMapping("/simpleParam")
public String simpleParam(HttpServletRequest request){
    String name = request.getParameter("name");
    String ageStr = request.getParameter("age");
    int age = Integer.parseInt(ageStr);
    System.out.println(name+"  :  "+age);
    return "OK";
}
</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/5a31841be8854c5aaa12362f49a6485c.jpg" target="_blank"><img alt="JavaWeb_第71张图片" height="260" src="http://img.e-com-net.com/image/info8/5a31841be8854c5aaa12362f49a6485c.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                SpringBoot方式： </p> 
  <p>                                      <span style="color:#fe2c24;">  简单参数：</span></p> 
  <p><span style="color:#fe2c24;">                                                参数名与形参变量名相同，定义形参即可接收参数</span> </p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/simpleParam")
public String simpleParam(String name , Integer age){
    System.out.println(name+"  :  "+age);
    return "OK";
}
</code></pre> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/bd2f79e2f1ff45bb97010d51ae95f5e4.jpg" target="_blank"><img alt="JavaWeb_第72张图片" height="238" src="http://img.e-com-net.com/image/info8/bd2f79e2f1ff45bb97010d51ae95f5e4.jpg" width="588" style="border:1px solid black;"></a></p> 
  <p class="img-center"><img alt="" height="0" src="http://img.e-com-net.com/image/info8/896a329b420749708cb0e280c6ec82bf.jpg" width="0"></p> 
  <p>                                        简单参数：</p> 
  <p>                                              <span style="color:#fe2c24;">  如果方法形参名称与请求参数名称不匹配，可以使用 </span><span style="color:#38d8f0;">@RequestParam</span><span style="color:#fe2c24;"> 完成映射 </span></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/simpleParam")
public String simpleParam(@RequestParam(name = "name") String username , Integer age){
    System.out.println(username + " : " + age);
    return "OK";
}
</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/16a78eae79e7498fbd64395c22ab822b.jpg" target="_blank"><img alt="JavaWeb_第73张图片" height="260" src="http://img.e-com-net.com/image/info8/16a78eae79e7498fbd64395c22ab822b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                        <span style="color:#fe2c24;">注意事项： </span></p> 
  <p><span style="color:#fe2c24;">                                                @RequestParam中的required属性默认为true，代表该请求参数必须传递，如果不传递将报错。 如果该参数是可选的，可以将required属性设置为false </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/84d748f836bb441b9792bb2d81d2b04b.jpg" target="_blank"><img alt="JavaWeb_第74张图片" height="414" src="http://img.e-com-net.com/image/info8/84d748f836bb441b9792bb2d81d2b04b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        3.实体参数： </p> 
  <p>                                简单实体对象：</p> 
  <p>                                        <span style="color:#fe2c24;">请求参数名与形参对象属性名相同，定义POJO接收即可 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/ba6478ef0ad24c70a4e68c894a662780.jpg" target="_blank"><img alt="JavaWeb_第75张图片" height="165" src="http://img.e-com-net.com/image/info8/ba6478ef0ad24c70a4e68c894a662780.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        Controller：</p> 
  <pre><code class="language-java">@RequestMapping("/simplePojo")public String simplePojo(User user){
    System.out.println(user);
    return "OK";
}
</code></pre> 
  <p>                        POJO： </p> 
  <pre><code class="language-java">public class User {
    private String name;
    private Integer age;
}
</code></pre> 
  <p>                                对象中接收时间日期类型： </p> 
  <p>                                        在时间日期类型上加 <span style="color:#fe2c24;">@DateTimeFormat</span>注解</p> 
  <p>                                POJO： </p> 
  <pre><code class="language-java">public class User {
    private Integer id;
    private String name;
    private String phone;
    private Idcard idcard;

    @DateTimeFormat(pattern = "yyyy-MM-dd")
    private LocalDate birthday;
}</code></pre> 
  <p>                                复杂实体对象： </p> 
  <p>                                        <span style="color:#fe2c24;">请求参数名与形参对象属性名相同，按照对象层次结构关系即可接收嵌套POJO属性参数 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/2210919cecb34dd598a6530776485910.jpg" target="_blank"><img alt="JavaWeb_第76张图片" height="199" src="http://img.e-com-net.com/image/info8/2210919cecb34dd598a6530776485910.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/complexPojo")
public String complexPojo(User user){
    System.out.println(user);
    return "OK";
}
</code></pre> 
  <p>                        POJO： </p> 
  <pre><code class="language-java">public class User {
    private String name;
    private Integer age;
    private Address address;
}
</code></pre> 
  <pre><code class="language-java">public class Address {
    private String province;
    private String city;
}
</code></pre> 
  <p>                        4.数组集合参数： </p> 
  <p>                                数组参数： </p> 
  <p>                                        <span style="color:#fe2c24;">请求参数名与形参数组名称相同且请求参数为多个，定义数组类型形参即可接收参数 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/63123ac78b5f4fc98b22ef1be1e017a2.jpg" target="_blank"><img alt="JavaWeb_第77张图片" height="161" src="http://img.e-com-net.com/image/info8/63123ac78b5f4fc98b22ef1be1e017a2.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/arrayParam")
    public String arrayParam(String[] hobby){
     System.out.println(Arrays.toString(hobby));
     return "OK";
 }</code></pre> 
  <p>                                集合参数：</p> 
  <p>                                        <span style="color:#fe2c24;">请求参数名与形参集合名称相同且请求参数为多个，</span><span style="color:#38d8f0;">@RequestParam</span><span style="color:#fe2c24;"> 绑定参数关系 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/744bf7c93ac145cb9813137b894ef798.jpg" target="_blank"><img alt="JavaWeb_第78张图片" height="161" src="http://img.e-com-net.com/image/info8/744bf7c93ac145cb9813137b894ef798.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/listParam")
    public String listParam(@RequestParam List<String> hobby){
        System.out.println(hobby);
        return "OK";
    }</code></pre> 
  <pre><code class="language-java">数组：请求参数名与形参中数组变量名相同，可以直接使用数组封装
集合：请求参数名与形参中集合变量名相同，通过@RequestParam绑定参数关系</code></pre> 
  <p>                                日期参数： </p> 
  <p>                                        <span style="color:#fe2c24;">使用 </span><span style="color:#38d8f0;">@DateTimeFormat</span><span style="color:#fe2c24;"> 注解完成日期参数格式转换 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/23db76221883410f9159e8bccd1b66fe.jpg" target="_blank"><img alt="JavaWeb_第79张图片" height="141" src="http://img.e-com-net.com/image/info8/23db76221883410f9159e8bccd1b66fe.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/dataParam")
    public String dataParam(@DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss") LocalDateTime updateTime){
        System.out.println(updateTime);
        return "OK";

    }</code></pre> 
  <p>                                JSON 参数： </p> 
  <p>                                        <span style="color:#fe2c24;">JSON数据键名与形参对象属性名相同，定义POJO类型形参即可接收参数，需要使用 </span><span style="color:#38d8f0;">@RequestBody</span><span style="color:#fe2c24;"> 标识</span> </p> 
  <p><a href="http://img.e-com-net.com/image/info8/85ebb2a36ecf487ea17a61de4806ee7f.jpg" target="_blank"><img alt="JavaWeb_第80张图片" height="201" src="http://img.e-com-net.com/image/info8/85ebb2a36ecf487ea17a61de4806ee7f.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java">@RequestMapping("/jsonParam")
    public String jsonParam(@RequestBody User user){
        System.out.println(user);
        return "OK";

    }</code></pre> 
  <p>                                POJO： </p> 
  <pre><code class="language-java">public class User {
    private String name;
    private int age;
    private Address address;
}</code></pre> 
  <pre><code class="language-java">public class Address {
    private String province;
    private String city;
}</code></pre> 
  <p>                                路径参数： </p> 
  <p>                                       <span style="color:#fe2c24;"> 通过请求URL直接传递参数，使用{…}来标识该路径参数，需要使用 </span><span style="color:#38d8f0;">@PathVariable</span><span style="color:#fe2c24;"> 获取路径参数 </span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/d8c43965480d4323b61fd7d84c02b0a3.jpg" target="_blank"><img alt="" height="83" src="http://img.e-com-net.com/image/info8/d8c43965480d4323b61fd7d84c02b0a3.jpg" width="650"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java"> @RequestMapping("/path/{id}")
    public String pathParam(@PathVariable Integer id){
        System.out.println(id);
        return "OK";

    }</code></pre> 
  <p></p> 
  <p><a href="http://img.e-com-net.com/image/info8/c5b40d2dd9b7472ea082fae97d821c33.jpg" target="_blank"><img alt="" height="87" src="http://img.e-com-net.com/image/info8/c5b40d2dd9b7472ea082fae97d821c33.jpg" width="650"></a></p> 
  <p>                                Controller： </p> 
  <pre><code class="language-java"> @RequestMapping("/path/{id}/{name}")
    public String pathParam2(@PathVariable Integer id,@PathVariable String name){
        System.out.println(id);
        System.out.println(name);
        return "OK";

    }</code></pre> 
  <p>                                总结： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/def6d3b9ab34405cae707cd9de35fd8a.jpg" target="_blank"><img alt="JavaWeb_第81张图片" height="382" src="http://img.e-com-net.com/image/info8/def6d3b9ab34405cae707cd9de35fd8a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>        （2）响应： </p> 
  <p>                        <a href="http://img.e-com-net.com/image/info8/f84b7538cd9f496ba0f11cd5f376fe07.jpg" target="_blank"><img alt="JavaWeb_第82张图片" height="167" src="http://img.e-com-net.com/image/info8/f84b7538cd9f496ba0f11cd5f376fe07.jpg" width="650" style="border:1px solid black;"></a> </p> 
  <p>                     <span style="color:#38d8f0;">   @ResponseBody： </span></p> 
  <p><span style="color:#38d8f0;">                                类型：方法注解、类注解 </span></p> 
  <p><span style="color:#38d8f0;">                                位置：Controller方法上/类上 </span></p> 
  <p><span style="color:#38d8f0;">                                作用：将方法返回值直接响应，如果返回值类型是 实体对象/集合 ，将会转换为JSON格式响应 </span></p> 
  <p><span style="color:#38d8f0;">                                说明：@RestController = @Controller + @ResponseBody </span></p> 
  <p></p> 
  <p>                        统一响应结果： </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/eec6c0d4bbd84cc692bd23c91652c697.jpg" target="_blank"><img alt="JavaWeb_第83张图片" height="485" src="http://img.e-com-net.com/image/info8/eec6c0d4bbd84cc692bd23c91652c697.jpg" width="448" style="border:1px solid black;"></a></p> 
  <p>                        Result类： </p> 
  <pre><code class="language-java">package com.lyc.pojo;

public class Result {
    private Integer code;    响应码：1代表成功    0代表失败
    private String msg;      提示信息
    private Object data;     返回的数据

    /*成功不带data*/
    public static Result success(){
        Result result = new Result();
        result.setCode(1);
        result.setMsg("成功");
        return result;
    }

    /*成功带data*/
    public static Result success(Object data){
        Result result = new Result();
        result.setCode(1);
        result.setMsg("成功");
        result.setData(data);
        return result;
    }

    /*失败带原因*/
    public static Result error(String msg){
        Result result = new Result();
        result.setCode(0);
        result.setMsg("失败");
        return result;
    }
    public Integer getCode() {
        return code;
    }

    public void setCode(Integer code) {
        this.code = code;
    }

    public String getMsg() {
        return msg;
    }

    public void setMsg(String msg) {
        this.msg = msg;
    }

    public Object getData() {
        return data;
    }

    public void setData(Object data) {
        this.data = data;
    }
}
</code></pre> 
  <p>                        POJO： </p> 
  <p>                                User类： </p> 
  <pre><code class="language-java">package com.lyc.pojo;

import org.springframework.format.annotation.DateTimeFormat;

import java.time.LocalDate;

public class User {
    private Integer id;
    private String name;
    private String phone;
    private Idcard idcard;
    @DateTimeFormat(pattern = "yyyy-MM-dd")
    private LocalDate birthday;

    public User() {
    }

    public User(Integer id, String name, String phone, Idcard idcard, LocalDate birthday) {
        this.id = id;
        this.name = name;
        this.phone = phone;
        this.idcard = idcard;
        this.birthday = birthday;
    }

    public LocalDate getBirthday() {
        return birthday;
    }

    public void setBirthday(LocalDate birthday) {
        this.birthday = birthday;
    }

    /**
     * 获取
     * @return id
     */
    public Integer getId() {
        return id;
    }

    /**
     * 设置
     * @param id
     */
    public void setId(Integer id) {
        this.id = id;
    }

    /**
     * 获取
     * @return name
     */
    public String getName() {
        return name;
    }

    /**
     * 设置
     * @param name
     */
    public void setName(String name) {
        this.name = name;
    }

    /**
     * 获取
     * @return phone
     */
    public String getPhone() {
        return phone;
    }

    /**
     * 设置
     * @param phone
     */
    public void setPhone(String phone) {
        this.phone = phone;
    }

    public Idcard getIdcard() {
        return idcard;
    }

    public void setIdcard(Idcard idcard) {
        this.idcard = idcard;
    }

    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", name='" + name + '\'' +
                ", phone='" + phone + '\'' +
                ", idcard=" + idcard +
                ", birthday=" + birthday +
                '}';
    }
}
</code></pre> 
  <p>                                Idcard类： </p> 
  <pre><code class="language-java">package com.lyc.pojo;

public class Idcard {
    private String no;
    private String nation;

    public Idcard() {
    }

    public Idcard(String no, String nation) {
        this.no = no;
        this.nation = nation;
    }

    public String getNo() {
        return no;
    }

    public void setNo(String no) {
        this.no = no;
    }

    public String getNation() {
        return nation;
    }

    public void setNation(String nation) {
        this.nation = nation;
    }

    @Override
    public String toString() {
        return "Idcard{" +
                "no=" + no +
                ", nation='" + nation + '\'' +
                '}';
    }
}
</code></pre> 
  <p>                        响应对象： </p> 
  <pre><code class="language-java"> @RequestMapping("/response2")
    public Result response2(){
        Idcard idcard1 = new Idcard("122", "北京");
        User user = new User(1, "张三", "13112345678", idcard1, LocalDate.of(2001, 01, 01));
        Result result = Result.success(user);
        return result;
    }</code></pre> 
  <p>                        响应集合： </p> 
  <pre><code class="language-java">@RequestMapping("/response3")
    public Result response3(){
        Idcard idcard1 = new Idcard("122", "北京");
        Idcard idcard2 = new Idcard("133", "上海");
        Idcard idcard3 = new Idcard("144", "深圳");

        User user1 = new User(1, "张三", "13112345678", idcard1, LocalDate.of(2000, 02, 03));
        User user2 = new User(2, "李四", "13112345679", idcard2, LocalDate.of(2001, 03, 04));
        User user3 = new User(3, "王五", "13112345670", idcard3, LocalDate.of(2002, 04, 05));

        ArrayList<User> list = new ArrayList<>();
        list.add(user1);
        list.add(user2);
        list.add(user3);

        Result result = Result.success(list);

        return result;

    }</code></pre> 
  <p></p> 
  <h3 id="28.%E4%B8%89%E5%B1%82%E6%9E%B6%E6%9E%84%C2%A0">28.三层架构 </h3> 
  <p>        </p> 
  <p class="img-center"><img alt="" height="0" src="http://img.e-com-net.com/image/info8/ca3bb6c31b95431c95cea06ac123cd56.jpg" width="0"></p> 
  <p></p> 
  <p>        <span style="color:#fe2c24;">（1）controller： </span></p> 
  <p><span style="color:#fe2c24;">                        控制层，接收前端发送的请求，对请求进行处理，并响应数据 </span></p> 
  <p><span style="color:#fe2c24;">        （2）service： </span></p> 
  <p><span style="color:#fe2c24;">                        业务逻辑层，处理具体的业务逻辑 </span></p> 
  <p><span style="color:#fe2c24;">        （3）dao： </span></p> 
  <p><span style="color:#fe2c24;">                        数据访问层(Data Access Object)（持久层），负责数据访问操作，包括数据的增、删、改、查 </span></p> 
  <p></p> 
  <h3 id="29.%E5%88%86%E5%B1%82%E8%A7%A3%E8%80%A6%C2%A0">29.分层解耦 </h3> 
  <p>        （1）内聚：</p> 
  <p>                        软件中各个功能模块内部的功能联系 </p> 
  <p>        （2）耦合：</p> 
  <p>                        衡量软件中各个层/模块之间的依赖、关联的程度 </p> 
  <p>        （3）软件设计原则：</p> 
  <p>                        高内聚低耦合 </p> 
  <p>        <span style="color:#fe2c24;">（4）控制反转（ IOC ）： </span></p> 
  <p><span style="color:#fe2c24;">                        Inversion Of Control，简称IOC。对象的创建控制权由程序自身转移到外部（容器），这种思想称为控制反转 </span></p> 
  <p><span style="color:#fe2c24;">        （5）依赖注入（ DI ）：</span></p> 
  <p><span style="color:#fe2c24;">                        Dependency Injection，简称DI。容器为应用程序提供运行时，所依赖的资源，称之为依赖注入 </span></p> 
  <p>        <span style="color:#fe2c24;">（6）Bean对象：</span></p> 
  <p><span style="color:#fe2c24;">                        IOC容器中创建、管理的对象，称之为bean </span></p> 
  <p></p> 
  <h3 id="30.%E6%A1%88%E4%BE%8B%C2%A0">30.案例 </h3> 
  <p><a href="http://img.e-com-net.com/image/info8/0833cda6987d4c88b57c5c6d3daf4d9e.jpg" target="_blank"><img alt="JavaWeb_第84张图片" height="311" src="http://img.e-com-net.com/image/info8/0833cda6987d4c88b57c5c6d3daf4d9e.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                步骤： </p> 
  <p>                        1.创建springboot工程，在pom文件中导入相关依赖，导入需要的实体类，工具类，xml文件等 </p> 
  <p>                       2.将静态页面文件，导入resources下的static目录下</p> 
  <p>                       3.编写Controller程序，处理请求，响应数据 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/703e2f5c3f044981872145c426c9c794.jpg" target="_blank"><img alt="JavaWeb_第85张图片" height="816" src="http://img.e-com-net.com/image/info8/703e2f5c3f044981872145c426c9c794.jpg" width="595" style="border:1px solid black;"></a></p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/4828bc5819aa434592d9e57e32d98bda.jpg" target="_blank"><img alt="JavaWeb_第86张图片" height="268" src="http://img.e-com-net.com/image/info8/4828bc5819aa434592d9e57e32d98bda.jpg" width="511" style="border:1px solid black;"></a></p> 
  <p>                代码： </p> 
  <pre><code class="language-java">Controller:

@RestController
public class EmpController {
    //注入Service 对象
    @Autowired
    EmpService empService;
    @RequestMapping("/listEmp")
    public Result queryAllEmp(){
        //调用 queryAllEmp() 进行业务处理
        List<Emp> empList = empService.queryAllEmp();
        //响应数据
        return Result.success(empList);
    }</code></pre> 
  <pre><code class="language-java">Service:

public interface EmpService {

    List<Emp> queryAllEmp();
}

</code></pre> 
  <pre><code class="language-java">ServiceImpl:

@Service
public class EmpServiceImpl implements EmpService {
    //注入 EmpDao 对象
    @Autowired
    EmpDao empDao;
    @Override
    public List<Emp> queryAllEmp() {
        List<Emp> empList = empDao.listEmp();

        for (Emp emp : empList) {
            if ("1".equals(emp.getGender())){
                emp.setGender("男");
            }else {
                emp.setGender("女");
            }

            if ("1".equals(emp.getJob())){
                emp.setJob("讲师");
            } else if ("2".equals(emp.getJob())) {
                emp.setJob("班主任");
            }else {
                emp.setJob("就业指导");
            }
        }
        return empList;
    }</code></pre> 
  <pre><code class="language-java">Dao:

public interface EmpDao {
    List<Emp> listEmp();
}</code></pre> 
  <pre><code class="language-java">DaoImpl:

@Repository
public class EmpDaoImpl implements EmpDao {
    @Override
    public List<Emp> listEmp() {
        URL resource = ClassLoader.getSystemClassLoader().getResource("emp.xml");
        String file = resource.getFile();
        //2.解析xml文件，获取数据
        List<Emp> empList = XmlParserUtils.parse(file, Emp.class);
        return empList;
    }</code></pre> 
  <p>                测试结果： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/5b181a0b1c2c42b18536523bea32e0a0.jpg" target="_blank"><img alt="JavaWeb_第87张图片" height="278" src="http://img.e-com-net.com/image/info8/5b181a0b1c2c42b18536523bea32e0a0.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="31.IOC%E8%AF%A6%E8%A7%A3%C2%A0">31.IOC详解 </h3> 
  <p>        （1）Bean的声明： </p> 
  <p>                        要把某个对象交给IOC容器管理，需要在对应的类上加上如下注解之一：</p> 
  <pre><code class="language-java">@Component	声明bean的基础注解	不属于以下三类时，用此注解
@Controller	@Component的衍生注解	标注在控制器类上
@Service	@Component的衍生注解	标注在业务类上
@Repository	@Component的衍生注解	标注在数据访问类上（由于与mybatis整合，用的少）</code></pre> 
  <p>        （2）注意事项： </p> 
  <p>                        1.声明bean的时候，可以通过value属性指定bean的名字，如果没有指定，默认为类名首字母小写 </p> 
  <p>                        2.使用以上四个注解都可以声明bean，但是在springboot集成web开发中，声明控制器bean只能用@Controller </p> 
  <p>        （3）Bean组件扫描： </p> 
  <p>                        声明bean的四大注解，要想生效，还需要被组件扫描注解@ComponentScan扫描 </p> 
  <p>                        @ComponentScan注解虽然没有显式配置，但是实际上已经包含在了启动类声明注解 @SpringBootApplication 中，默认扫描的范围是启动类所在包及其子包 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/c32905f64b4941c4baf24fc1f6e05da4.jpg" target="_blank"><img alt="JavaWeb_第88张图片" height="313" src="http://img.e-com-net.com/image/info8/c32905f64b4941c4baf24fc1f6e05da4.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h3 id="32.DI%E8%AF%A6%E8%A7%A3%C2%A0">32.DI详解 </h3> 
  <p>        （1）Bean注入： </p> 
  <p>                        @Autowired注解，默认是按照类型进行，如果存在多个相同类型的bean，将会报出如下错误： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/50824822ba0b4c7abfb464415c8ccf73.jpg" target="_blank"><img alt="JavaWeb_第89张图片" height="108" src="http://img.e-com-net.com/image/info8/50824822ba0b4c7abfb464415c8ccf73.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        通过以下几种方案来解决： </p> 
  <pre><code class="language-java">@Primary    提升Bean的优先级
@Service
public class EmpServiceA implements EmpService {
}
</code></pre> 
  <pre><code class="language-java">@RestController
public class EmpController {
    @Autowired    默认按照类型自动装配
    @Qualifier("empServiceA")    为bean设置名称
    private EmpService empService;
</code></pre> 
  <pre><code class="language-java">@RestController
public class EmpController {
    @Resource(name = "empServiceB")    name="bean的名称"
    private EmpService empService ;</code></pre> 
  <p>        （<span style="color:#fe2c24;">2）@Resource 与 @Autowired区别： </span></p> 
  <p><span style="color:#fe2c24;">                        @Autowired 是spring框架提供的注解，而@Resource是JDK提供的注解 </span></p> 
  <p><span style="color:#fe2c24;">                        @Autowired 默认是按照类型注入，而@Resource默认是按照名称注入 </span></p> 
  <p></p> 
  <h3 id="33.%E6%B3%A8%E8%A7%A3%C2%A0">33.注解 </h3> 
  <pre><code class="language-java">@RestController
	@Component衍生注解，内置了@Component、@ResponseBody
	启动类启动的时候，就会扫描到这个注解，创建对象，放入ioc容器

@RequestMapping
	指定访问路径的，通常用于类上和方法上，分别代表一级二级路径

@RequestParam
	1.为参数起别名(别名映射)
    2.接收List集合参数
    3.默认属性required = true，代表必须传递参数，不传报错400
    4.如required = true，且并没有传参数。default属性可以指定默认值，防止报错

@RequestBody
	接受请求体的内容，get请求没有请求体，通常接收post等非get请求的请求体，通常接收json格式数据

@PathVariable
	路径参数映射到方法的形参上的

@ResponseBody
	将return的数据，响应给浏览器。如果是对象，帮我们自动转成json格式再做响应

@Primary
	如果同类型下有多个bean对象，可以使用该注解声明谁的优先级最高

@Autowired
	依赖注入，默认按照类型去容器中匹配完成注入。如果同类型bean对象有多个，则报错

@Qualifier
	为了解决以上报错问题，根据名字匹配一个容器中的对象，@Autowired基础上使用

@Resource
	直接根据名字去容器匹配对象，属于jdk提供的，jdk1.8之后不在提供（慎用）

@Component
	声明当前会被框架创建，并放入容器，IOC注解（控制反转，我们不new，框架来创建）
	@Controller
	@Service
	@Repository</code></pre> 
  <p></p> 
  <h3 id="34.MySQL%20%EF%BC%88%E6%95%B0%E6%8D%AE%E5%BA%93%EF%BC%89">34.MySQL （数据库）</h3> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%881%EF%BC%89%C2%A0%E4%BB%8B%E7%BB%8D">        （1） 介绍</h4> 
  <p>                        数据库：DataBase（DB），是存储和管理数据的仓库 </p> 
  <p>                        数据库管理系统：DataBase Management System  (DBMS)，操纵和管理数据库的大型软件 </p> 
  <p>                        SQL：Structured Query Language，操作关系型数据库的编程语言，定义了一套操作关系型数据库统一标准 </p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%882%EF%BC%89%E6%95%B0%E6%8D%AE%E5%BA%93%E4%BA%A7%E5%93%81%C2%A0">        （2）数据库产品 </h4> 
  <p><a href="http://img.e-com-net.com/image/info8/5b6c04a7376b40deb5a580c9d8c5a13b.jpg" target="_blank"><img alt="JavaWeb_第90张图片" height="217" src="http://img.e-com-net.com/image/info8/5b6c04a7376b40deb5a580c9d8c5a13b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <pre><code class="language-java">Oracle	收费的大型数据库，Oracle公司的产品。
MySQL    开源免费的中小型数据库。Sun公司收购了MySQL，Oracle收购Sun公司。	
SQL Server	MicroSoft公司收费的中型的数据库。C#、.net等语言常使用。
PostgreSQL	开源免费中小型的数据库。
DB2	IBM公司的大型收费数据库产品。
SQLite	嵌入式的微型数据库。如：作为Android内置数据库
MariaDB	开源免费的中小型的数据库。</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%883%EF%BC%89MySQL%E5%AE%89%E8%A3%85%C2%A0">        （3）MySQL安装 </h4> 
  <p>                MySQL官方提供了两种不同的版本： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/b43123195c674f42a6d64ff271a40c89.jpg" target="_blank"><img alt="JavaWeb_第91张图片" height="161" src="http://img.e-com-net.com/image/info8/b43123195c674f42a6d64ff271a40c89.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                我们安装使用的是：（MySQL Community Server） </p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.MySQL%E4%B8%8B%E8%BD%BD%C2%A0">                1.MySQL下载 </h5> 
  <p>                        官网：MySQL :: MySQL Downloads </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/9c74277159ca4b2db1d92fc48270ac1e.jpg" target="_blank"><img alt="JavaWeb_第92张图片" height="284" src="http://img.e-com-net.com/image/info8/9c74277159ca4b2db1d92fc48270ac1e.jpg" width="394" style="border:1px solid black;"></a></p> 
  <p><a href="http://img.e-com-net.com/image/info8/371d0f1ef83a43d097def45bb9bfd857.jpg" target="_blank"><img alt="JavaWeb_第93张图片" height="463" src="http://img.e-com-net.com/image/info8/371d0f1ef83a43d097def45bb9bfd857.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E8%A7%A3%E5%8E%8B%C2%A0">                2.解压 </h5> 
  <p>                        下载完成后我们得到的是一个压缩包，我们可以把它放在你想安装的位置，将其解压 ：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/40e02c78534148fcbf20750b78043f43.jpg" target="_blank"><img alt="JavaWeb_第94张图片" height="214" src="http://img.e-com-net.com/image/info8/40e02c78534148fcbf20750b78043f43.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E9%85%8D%E7%BD%AE%E7%8E%AF%E5%A2%83%E5%8F%98%E9%87%8F">                3.配置环境变量</h5> 
  <p>                        右键此电脑 ➡属性➡ 高级系统设置</p> 
  <p><a href="http://img.e-com-net.com/image/info8/7828003409814619b235c2648edb0362.jpg" target="_blank"><img alt="JavaWeb_第95张图片" height="217" src="http://img.e-com-net.com/image/info8/7828003409814619b235c2648edb0362.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        选择高级➡环境变量 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/b4d01c688b864540b66797ab1a50b922.jpg" target="_blank"><img alt="JavaWeb_第96张图片" height="691" src="http://img.e-com-net.com/image/info8/b4d01c688b864540b66797ab1a50b922.jpg" width="605" style="border:1px solid black;"></a></p> 
  <p>                        在系统变量中找到 path ，双击 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/3de01345f0ea4251b2ebeb270ec83b66.jpg" target="_blank"><img alt="JavaWeb_第97张图片" height="272" src="http://img.e-com-net.com/image/info8/3de01345f0ea4251b2ebeb270ec83b66.jpg" width="650" style="border:1px solid black;"></a>  </p> 
  <p>                        点击新建，将解压后的 bin 目录路径粘贴进去</p> 
  <p><a href="http://img.e-com-net.com/image/info8/d11d7b0fd94f4ec1af6f23ce03cc8b6e.jpg" target="_blank"><img alt="JavaWeb_第98张图片" height="634" src="http://img.e-com-net.com/image/info8/d11d7b0fd94f4ec1af6f23ce03cc8b6e.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <p>                        然后一路点击确定，到这里环境变量就算配置完成了 </p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E9%AA%8C%E8%AF%81%E6%98%AF%E5%90%A6%E6%B7%BB%E5%8A%A0%E6%88%90%E5%8A%9F%C2%A0">                4.验证是否添加成功 </h5> 
  <p>                        以管理员身份运行命令行窗口，输入 mysql 敲回车：</p> 
  <p><a href="http://img.e-com-net.com/image/info8/5f3081137ce44c04b8f1d09c11d7f894.jpg" target="_blank"><img alt="JavaWeb_第99张图片" height="220" src="http://img.e-com-net.com/image/info8/5f3081137ce44c04b8f1d09c11d7f894.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        如果提示 <span style="color:#fe2c24;">Can't connect to MySQL server on ’localhost:3306’(10061) </span>则证明添加成功  </p> 
  <p>                        如果提示 <span style="color:#38d8f0;">MySQL</span><code><span style="color:#38d8f0;">不是内部或外部命令，也不是可运行的程序或批处理文件 </span></code>则表示添加失败，请重新检查步骤并重试  </p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E5%88%9D%E5%A7%8B%E5%8C%96MySQL%C2%A0">                5.初始化MySQL </h5> 
  <p>                        以管理员身份运行命令行窗口： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/a4a7f49a2eb8406e8a39a393c401aaad.jpg" target="_blank"><img alt="JavaWeb_第100张图片" height="294" src="http://img.e-com-net.com/image/info8/a4a7f49a2eb8406e8a39a393c401aaad.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        在命令行中输入指令： </p> 
  <pre><code class="language-java">mysqld --initialize-insecure</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/21a46d47a6264db7a67beaad8c6ab737.jpg" target="_blank"><img alt="JavaWeb_第101张图片" height="174" src="http://img.e-com-net.com/image/info8/21a46d47a6264db7a67beaad8c6ab737.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        如果出现没有出现报错信息，则证明data目录初始化没有问题，此时再查看MySQL目录下已经有data目录生成  </p> 
  <p><a href="http://img.e-com-net.com/image/info8/3a130e2c3b50460d9ac80bc75536d48c.jpg" target="_blank"><img alt="JavaWeb_第102张图片" height="303" src="http://img.e-com-net.com/image/info8/3a130e2c3b50460d9ac80bc75536d48c.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%205.%E6%B3%A8%E5%86%8CMySQL%E6%9C%8D%E5%8A%A1%C2%A0%C2%A0">                6.注册MySQL服务  </h5> 
  <p>                         在命令行中输入指令：</p> 
  <pre><code class="language-java">mysqld -install</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/61431f1037fd40e99fc125813b58c83c.jpg" target="_blank"><img alt="JavaWeb_第103张图片" height="202" src="http://img.e-com-net.com/image/info8/61431f1037fd40e99fc125813b58c83c.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        到这步已经成功安装好MySQL服务了  </p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%206.%E5%90%AF%E5%8A%A8%E3%80%81%E5%81%9C%E6%AD%A2%20MySQL%E6%9C%8D%E5%8A%A1">                7.启动、停止 MySQL服务</h5> 
  <p>                         在命令行中输入指令：</p> 
  <pre><code class="language-java">net start mysql   启动mysql服务
    
net stop mysql   停止mysql服务</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/6419ce04f6b04ece80b975fefbc2f763.jpg" target="_blank"><img alt="JavaWeb_第104张图片" height="232" src="http://img.e-com-net.com/image/info8/6419ce04f6b04ece80b975fefbc2f763.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%207.%E4%BF%AE%E6%94%B9%E9%BB%98%E8%AE%A4%E8%B4%A6%E6%88%B7%E5%AF%86%E7%A0%81%C2%A0">                8.修改默认账户密码 </h5> 
  <p>                        在黑框里敲入<code>mysqladmin -u root password 123456</code>，这里的<code>123456 </code>就是指默认管理员(即root账户)的密码，可以自行修改成你喜欢的  </p> 
  <pre><code class="language-java">mysqladmin -u root password 123456</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/c98011ffb61f4ef894b38ad4064d47b5.jpg" target="_blank"><img alt="JavaWeb_第105张图片" height="283" src="http://img.e-com-net.com/image/info8/c98011ffb61f4ef894b38ad4064d47b5.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%208.%E7%99%BB%E5%BD%95%C2%A0MySQL">                9.登录 MySQL</h5> 
  <p>                        在命令行窗口中输入指令： </p> 
  <pre><code class="language-sql">mysql -uroot -p123456</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/ad4a998e1b8943299e514a4b9ca2481a.jpg" target="_blank"><img alt="JavaWeb_第106张图片" height="401" src="http://img.e-com-net.com/image/info8/ad4a998e1b8943299e514a4b9ca2481a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        到这里就成功登录mysql了 </p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%209.%E9%80%80%E5%87%BAmysql%E6%8C%87%E4%BB%A4%C2%A0">                9.退出mysql指令 </h5> 
  <pre><code class="language-sql">exit
quit</code></pre> 
  <p>                        登陆参数 ： </p> 
  <pre><code class="language-java">mysql -u用户名 -p密码 -h要连接的mysql服务器的ip地址(默认127.0.0.1) -P端口号(默认3306)</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%2010.%E5%8D%B8%E8%BD%BDmysql%C2%A0">                10.卸载mysql </h5> 
  <p>                        以管理员身份运行命令行窗口： </p> 
  <p>                                1.输入指令，回车： </p> 
  <pre><code class="language-java">net stop mysql</code></pre> 
  <p>                                2.输入指令，回车： </p> 
  <pre><code class="language-java">mysqld -remove mysql</code></pre> 
  <p>                                3.最后删除MySQL目录及相关的环境变量  </p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%884%EF%BC%89MySQL%E6%95%B0%E6%8D%AE%E6%A8%A1%E5%9E%8B%C2%A0">        （4）MySQL数据模型 </h4> 
  <p>                        关系型数据库（RDBMS）: 建立在关系模型基础上，由多张相互连接的二维表组成的数据库 </p> 
  <p>                         特点： </p> 
  <p>                                1.使用表存储数据，格式统一，便于维护 </p> 
  <p>                                2.使用SQL语言操作，标准统一，使用方便，可用于复杂查询 </p> 
  <p><a href="http://img.e-com-net.com/image/info8/aeca827b753d4ba4bd2f72cb90fbe2dc.jpg" target="_blank"><img alt="JavaWeb_第107张图片" height="316" src="http://img.e-com-net.com/image/info8/aeca827b753d4ba4bd2f72cb90fbe2dc.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%885%EF%BC%89SQL%E7%AE%80%E4%BB%8B">        （5）SQL简介</h4> 
  <p>                        <span style="color:#fe2c24;">SQL：一门操作关系型数据库的编程语言，定义操作所有关系型数据库的统一标准</span> </p> 
  <p>                        <span style="color:#38d8f0;">通用语法： </span></p> 
  <p><span style="color:#38d8f0;">                                1.SQL语句可以单行或多行书写，以分号结尾 </span></p> 
  <p><span style="color:#38d8f0;">                                2.SQL语句可以使用空格/缩进来增强语句的可读性 </span></p> 
  <p><span style="color:#38d8f0;">                                3.MySQL数据库的SQL语句不区分大小写 </span></p> 
  <p>                                4.注释： </p> 
  <p>                                       <span style="color:#fe2c24;"> 单行注释：-- 注释内容 或 # 注释内容(MySQL特有) </span></p> 
  <p>                                        多行注释： /* 注释内容 */ </p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%886%EF%BC%89SQL%E5%88%86%E7%B1%BB%C2%A0">        （6）SQL分类 </h4> 
  <p>                                SQL语句通常被分为四大类： </p> 
  <pre><code class="language-sql">DDL	Data Definition Language	数据定义语言，用来定义数据库对象(数据库，表，字段)
DML	Data Manipulation Language	数据操作语言，用来对数据库表中的数据进行增删改
DQL	Data Query Language	数据查询语言，用来查询数据库中表的记录
DCL	Data Control Language	数据控制语言，用来创建数据库用户、控制数据库的访问权限</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%887%EF%BC%89DDL%C2%A0">        （7）DDL </h4> 
  <p>                        DDL 英文全称是 <span style="color:#fe2c24;">Data Definition Language</span>，<span style="color:#fe2c24;">数据定义语言</span>，用来<span style="color:#fe2c24;">定义数据库对象(数据库、表) </span></p> 
  <p>                        DDL（数据库操作）： </p> 
  <pre><code class="language-sql">DDL-数据库操作
	show databases ; 查看当前所有数据库
	create database 数据库名 ;   创建数据库
	use 数据库名 ;   切换到某个数据库
	select database() ;   查看当前处于哪个数据库
	drop database 数据库名    删除数据库
</code></pre> 
  <p>                        DDL（表操作）： </p> 
  <pre><code class="language-sql">DDL-表操作
	show tables ; 查看当前数据库所有的表
	create table 表名 （字段 字段类型 ，字段 字段类型）;  创建表
	desc 表名 ; 查看当前表有哪些字段
	show create table 表名 ;  查询表的建表语句
	alter table 表名 add/modify/change/drop/rename to... ; 表的修改操作
	drop table 表名 ;  删除表

创建表标准格式：
    create table  表名(
	字段1  字段类型  [ 约束 ]  [ comment  字段1注释 ] ,
	......
	字段n  字段类型  [ 约束 ]  [ comment  字段n注释 ] 
) [ comment  表注释 ] ;


DDL-表操作-修改

	添加字段
	alter table 表名 add 字段名 类型（长度）[comment 注释] [约束] ;

修改数据类型
	alter table 表名 modify 字段名 新数据类型（长度）;

修改字段名和数据类型
	alter table 表名 change 旧字段名 新字段名 类型（长度）[comment 注释] [约束] ;

删除字段
	alter table 表名 drop 字段名 ;

修改表名
	alter table 表名 rename to 新表名 ;

删除表
	drop table [ if exists ] 表名 ;

删除指定表，并重新创建该表
	truncate table 表名 ;
在删除表时，表中的所有数据也会被删除。

注意：
    语法中的database，就等同于 schema</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%888%EF%BC%89%E7%BA%A6%E6%9D%9F%C2%A0">        （8）约束 </h4> 
  <p>                        概念：约束是作用于表中字段上的规则，用于限制存储在表中的数据 </p> 
  <p>                        目的：保证数据库中数据的正确性、有效性和完整性 </p> 
  <pre><code class="language-sql">非空约束	    限制该字段值不能为    null	not  null
唯一约束	    保证字段的所有数据都是唯一、不重复的	unique
主键约束	    主键是一行数据的唯一标识，要求非空且唯一	primary  key
默认约束	    保存数据时，如果未指定该字段值，则采用默认值	default
外键约束	    让两张表的数据建立连接，保证数据的一致性和完整性	foreign  key</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%889%EF%BC%89MySQL%E5%AE%A2%E6%88%B7%E7%AB%AF%E5%B7%A5%E5%85%B7-%E5%9B%BE%E5%BD%A2%E5%8C%96%E5%B7%A5%E5%85%B7">        （9）MySQL客户端工具-图形化工具</h4> 
  <p><a href="http://img.e-com-net.com/image/info8/19b4fd62ad6f41ce87c99ec46981deae.jpg" target="_blank"><img alt="JavaWeb_第108张图片" height="182" src="http://img.e-com-net.com/image/info8/19b4fd62ad6f41ce87c99ec46981deae.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                        介绍：DataGrip是JetBrains旗下的一款数据库管理工具，是管理和开发MySQL、Oracle、PostgreSQL的理想解决方案 </p> 
  <p>                        官网：JetBrains: Essential tools for software developers and teams </p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8810%EF%BC%89%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B">        （10）数据类型</h4> 
  <p>                        MySQL中的数据类型主要分为三类：<span style="color:#fe2c24;">数值类型、字符串类型、日期时间类型 </span></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.%E6%95%B0%E5%80%BC%E7%B1%BB%E5%9E%8B%C2%A0">                        1.数值类型 </h5> 
  <p><a href="http://img.e-com-net.com/image/info8/ade4fb3ac1b9425eaa6d7fa5ea68159c.jpg" target="_blank"><img alt="JavaWeb_第109张图片" height="513" src="http://img.e-com-net.com/image/info8/ade4fb3ac1b9425eaa6d7fa5ea68159c.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E6%97%A5%E6%9C%9F%E5%92%8C%E6%97%B6%E9%97%B4%E7%B1%BB%E5%9E%8B%C2%A0">                        2.日期和时间类型 </h5> 
  <p><a href="http://img.e-com-net.com/image/info8/e30f0917cba349418e41ccd256c10e8e.jpg" target="_blank"><img alt="JavaWeb_第110张图片" height="293" src="http://img.e-com-net.com/image/info8/e30f0917cba349418e41ccd256c10e8e.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E5%AD%97%E7%AC%A6%E4%B8%B2%E7%B1%BB%E5%9E%8B%C2%A0">                        3.字符串类型 </h5> 
  <p><a href="http://img.e-com-net.com/image/info8/ab0d7b5ba1424f78b876e2a1153057de.jpg" target="_blank"><img alt="JavaWeb_第111张图片" height="353" src="http://img.e-com-net.com/image/info8/ab0d7b5ba1424f78b876e2a1153057de.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8811%EF%BC%89DML%C2%A0">        （11）DML </h4> 
  <p>                        DML英文全称是<span style="color:#fe2c24;">Data Manipulation Language(数据操作语言)</span>，用来对数据库中表的数据记录进行<span style="color:#fe2c24;">增、删、改</span>操作 </p> 
  <pre><code class="language-sql">DML-介绍
	( insert ) 添加数据

                注意事项：
                    1.插入数据时，指定的字段顺序需要与值的顺序是一一对应的
                    2.字符串和日期型数据应该包含在引号中
                    3.插入的数据大小，应该在字段的规定范围内

	( update ) 修改数据

                注意事项：
                    修改语句的条件可以有，也可以没有，如果没有条件，则会修改整张表的所有数据

	( delete ) 删除数据
            
                注意事项：
                    1.DELETE 语句的条件可以有，也可以没有，如果没有条件，则会删除整张表的所有数据
                    2.DELETE 语句不能删除某一个字段的值(如果要操作，可以使用UPDATE，将该字段的值置为NULL)

DML-添加数据
1.给指定字段添加数据
	insert into 表名 ( 字段1，字段2，...) values( 值1，值2，...) ;

2.给全部字段添加数据
	insert into 表名 values (值1，值2，...) ;

3.批量添加数据
	insert into 表名 ( 字段名1，字段名2，..) values (值1，值2，..) ，(值1，值2，..) ,(值1，值2，..) ;
	insert into 表名 values (值1，值2，..) , (值1，值2，..) , (值1，值2，..) ;

DML-修改数据
	update 表名 set 字段名1=值1 , 字段名2=值2 , ..[ where 条件 ] ;

DML-删除数据
	delete from 表名 [ where 条件 ] ;
注意：
	delete语句的条件可以有，也可以没有，如果没有条件，则会删除整张表的所有数据
	delete语句不能删除某一个字段的值（可以使用update）</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8812%EF%BC%89DQL">        （12）DQL</h4> 
  <p>                        DQL英文全称是<span style="color:#fe2c24;">Data Query Language(数据查询语言)</span>，用来<span style="color:#fe2c24;">查询数据库表中的记录</span> </p> 
  <p>                        关键字：<span style="color:#fe2c24;">SELECT </span></p> 
  <p>                        语法： </p> 
  <p><a href="http://img.e-com-net.com/image/info8/dc325124c3364fd4b552ed3bb73242cc.jpg" target="_blank"><img alt="JavaWeb_第112张图片" height="334" src="http://img.e-com-net.com/image/info8/dc325124c3364fd4b552ed3bb73242cc.jpg" width="650" style="border:1px solid black;"></a></p> 
  <pre><code class="language-sql">select
		字段列表
	from
		表名列表
	where
		条件列表
	group by
		分组字段列表
	having
		分组后条件列表
	order by
		排序字段列表
	limit
		分页参数 </code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.DQL-%20%E5%9F%BA%E6%9C%AC%E6%9F%A5%E8%AF%A2">                1.DQL- 基本查询</h5> 
  <pre><code class="language-sql">基本查询
	条件查询（where）
	聚合函数（conut 、max、min、avg、sum）
	分组查询（group by）
	排序查询（order by）
	分页查询（limit）

1.查询多个字段
	select 字段1，字段2，字段3... from 表名 ;

2.查询所有字段
	select * from 表名 ;

3.设置别名
	select 字段1[ as 别名1 ]，字段2[ as 别名2 ] ... from 表名 ;

4.去除重复记录
	select distinct 字段列表 from 表名 ;

注意：
        * 号代表查询所有字段，在实际开发中尽量少用（不直观、影响效率）</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.DQL-%20%E6%9D%A1%E4%BB%B6%E6%9F%A5%E8%AF%A2%C2%A0">                2.DQL- 条件查询 </h5> 
  <pre><code class="language-sql">DQL-条件查询
    条件查询（where）
	1.语法
	select 字段列表 from 表名 where  条件列表 ; 

比较运算符：

    >	    大于
    >=	    大于等于
    <	    小于
    <=	    小于等于
    =	    等于
    <>  或 !=	    不等于
    between ... and ...	    在某个范围之内(含最小、最大值)
    in(...)	    在in之后的列表中的值，多选一
    like  占    位符	模糊匹配(_匹配单个字符, %匹配任意个字符)
    is null	    是null 

逻辑运算符;

    and  或  &&	    并且 (多个条件同时成立)
    or  或  ||	    或者 (多个条件任意一个成立)
    not  或  !	    非 , 不是</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.DQL-%20%E8%81%9A%E5%90%88%E5%87%BD%E6%95%B0%C2%A0">                3.DQL- 聚合函数 </h5> 
  <p>                        聚合函数： </p> 
  <p>                                介绍：将一列数据作为一个整体，进行纵向计算 </p> 
  <pre><code class="language-sql">DQL-聚合函数

	常见的聚合函数：

	    count  统计数量
	    max  最大值
	    min  最小值
	    avg  平均值
	    sum  求和

语法：

	select 聚合函数 ( 字段列表 ) from 表名;

	注意：
		1.null值不参与所有聚合函数运算
        2.统计数量可以使用：count(*)   count(字段)   count(常量)，推荐使用count(*)</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.DQL-%20%E5%88%86%E7%BB%84%E6%9F%A5%E8%AF%A2">                4.DQL- 分组查询</h5> 
  <pre><code class="language-sql">DQL-分组查询

1.语法：
	select 字段列表 from 表名 [ where 条件 ] group by  分组字段名 [ having 分组后过滤条件 ] ;

2.where与having 区别：
	执行时机不同：where 是分组之前进行过滤，不满足where 条件，不参与分组；而having是分组之后对结果进行过滤
	判断条件不同：where 不能对聚合函数进行判断，而having可以
注意：
	执行顺序：where > 聚合函数 >having
	分组之后，查询的字段一般为聚合函数和分组字段，查询其他字段无任何意义</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%205.DQL-%20%E6%8E%92%E5%BA%8F%E6%9F%A5%E8%AF%A2%C2%A0">                5.DQL- 排序查询 </h5> 
  <pre><code class="language-sql">DQL-排序查询

1.语法：
	select 字段列表 from 表名 order by 字段1 排序方式1 ,字段2 排序方式2 ;

2.排序方式：
	ASC 升序（默认值）
	DESC 降序 

注意：
    如果是多字段排序，当第一个字段值相同时，才会根据第二个字段进行排序</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%206.DQL-%20%E5%88%86%E9%A1%B5%E6%9F%A5%E8%AF%A2">                6.DQL- 分页查询</h5> 
  <pre><code class="language-sql">DQL-分页查询

1.语法
	select 字段列表 from 表名 limit  起始索引 , 查询记录数 ;
注意：
	1.起始索引从0开始，起始索引=（查询页码 -1）* 每页查询记录数
	2.分页查询是数据库方言，不同的数据库有不同的实现，mysql 中是limit
	3.如果查询的是第一页数据，起始索引可以省略，直接简写为limit10

DQL-执行顺序
	from
		表明列表
	where
		条件列表
	group by 
		分组字段列表
	having 
		分组后条件列表
	select
		字段列表
	order by 
		排序字段列表
	limit
		分页参数</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8813%EF%BC%89%C2%A0DCL">        （13） DCL</h4> 
  <p>                        介绍： </p> 
  <p>                                DCL（<span style="color:#fe2c24;">数据控制语言</span>），用来<span style="color:#fe2c24;">管理数据库 用户，控制数据库的访问 权限</span> </p> 
  <pre><code class="language-sql">DCL-管理用户
1.查询用户
	use mysql ;
	select * from user ;

2.创建用户
	create user '用户名'@'主机名' identified by '密码' ;

3.修改用户密码
	alter user '用户名'@'主机名' identified with mysql_native_password by '新密码' ;

4.删除用户
	drop user '用户名'@'主机名' ；

DCL-权限控制
常用权限
	all , all privileges  所有权限
	select  查询数据
	insert  插入数据
	update  修改数据
	delete  删除数据
	alter  修改表
	drop  删除数据库  / 表 / 视图
	create  创建数据库 / 表

DCL-权限控制
1.查询权限
	show grants  for '用户名'@'主机名' ;
	
2.授予权限
	grant 权限列表 on 数据库名.表名 to '用户名'@'主机名' ;

3.撤销权限
	revoke 权限列表 on 数据库名.表名 from '用户名'@'主机名' ; </code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8814%EF%BC%89%C2%A0%E5%87%BD%E6%95%B0%EF%BC%9A">        （14） 函数：</h4> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A01.%E5%AD%97%E7%AC%A6%E4%B8%B2%E5%87%BD%E6%95%B0">                         1.字符串函数</h5> 
  <pre><code class="language-sql">常用的字符串函数
	concat( S1,S2,.....Sn ) 字符串拼接，将S1,S2,....Sn拼接成一个字符串

	lower( str ) 将字符串str 全部转为小写

	upper( str ) 将字符串全部转为大写

	lpad( str , n , pad ) 左填充，用字符串pad 对str 的左边进行填充，达到n个字符串长度

	rpad( str , n , pad ) 右填充，用字符串pad 对str 的右边进行填充，达到n个字符串长度

	trim( str ) 去掉字符串头部和尾部的空格

	substring( str , start , len ) 返回字符串str 从 start 位置起的len 个长度的字符串  </code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E6%95%B0%E5%80%BC%E5%87%BD%E6%95%B0">                        2.数值函数</h5> 
  <pre><code class="language-sql">常见的数值函数
	ceil( x ) 向上取整

	floor( x ) 向下取整

	mod( x,y ) 返回x/y 的模

	rand() 返回0-1内的随机数

	round( x, y ) 求参数 x 四舍五入的值，保留y位小数</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E6%97%A5%E6%9C%9F%E5%87%BD%E6%95%B0">                        3.日期函数</h5> 
  <pre><code class="language-sql">常见的日期函数
	curdate() 返回当前日期

	curtime() 返回当前时间

	now() 返回当前日期和时间

	year( date ) 获取指定date 的年份

	month( date ) 获取指定 date 的月份

	day( date ) 获取指定date 的日期

	date_add( date ,interval expr type ) 返回一个日期/时间值加上一个时间间隔 expr 后的时间值

	datediff( date1 , date2 ) 返回起始时间date1 和结束时间date2 之间的天数
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E6%B5%81%E7%A8%8B%E5%87%BD%E6%95%B0">                        4.流程函数</h5> 
  <pre><code class="language-sql">if( value , t , f ) 如果value 为true ，则返回t ,否则返回f 

ifnull( value1 , value2 ) 如果value1 不为空则返回value1 否则返回value2 

case when [ val1 ] then [ res1 ] ....else [ default ] end 如果val1 为true 返回res1,... 否则返回default 默认值

case [ expr ] when [ val1 ] then [ res1 ] ... else [ default ] end 如果expr 的值等于val1,返回res1,... f否则返回 default 默认值</code></pre> 
  <p></p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8815%EF%BC%89%E5%A4%9A%E8%A1%A8%E8%AE%BE%E8%AE%A1">        （15）多表设计</h4> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.%E4%B8%80%E5%AF%B9%E5%A4%9A%C2%A0%EF%BC%88%E5%A4%9A%E5%AF%B9%E4%B8%80%EF%BC%89">                        1.一对多 （多对一）</h5> 
  <p>                                一对多关系实现：在数据库表中多方，添加字段，来关联属于一方的主键  </p> 
  <p><a href="http://img.e-com-net.com/image/info8/245af7fcfcc7414c8ad3f176ff40728e.jpg" target="_blank"><img alt="JavaWeb_第113张图片" height="135" src="http://img.e-com-net.com/image/info8/245af7fcfcc7414c8ad3f176ff40728e.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E4%B8%80%E5%AF%B9%E4%B8%80%C2%A0">                        2.一对一 </h5> 
  <p>                                一对一 ：在任意一方加入字段，对应另外一方的主键，并且设置该字段为唯一的(UNIQUE)  </p> 
  <p><a href="http://img.e-com-net.com/image/info8/956de99d8ef34453a904e2c2aa04e5ca.jpg" target="_blank"><img alt="JavaWeb_第114张图片" height="128" src="http://img.e-com-net.com/image/info8/956de99d8ef34453a904e2c2aa04e5ca.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E5%A4%9A%E5%AF%B9%E5%A4%9A%C2%A0">                        3.多对多 </h5> 
  <p>                                案例：学生与课程的关系  </p> 
  <p>                                关系：一个学生可以选修多门课程，一门课程也可以供多个学生选择</p> 
  <p>                                实现关系1：建立第三张中间表，中间表至少包含两个外键，分别关联两方主键</p> 
  <p><a href="http://img.e-com-net.com/image/info8/cd3bf3014e5c4ccfa9920c02c8633a8a.jpg" target="_blank"><img alt="JavaWeb_第115张图片" height="208" src="http://img.e-com-net.com/image/info8/cd3bf3014e5c4ccfa9920c02c8633a8a.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8816%EF%BC%89%E5%A4%96%E9%94%AE%E7%BA%A6%E6%9D%9F%C2%A0">        （16）外键约束 </h4> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.%E7%89%A9%E7%90%86%E5%A4%96%E9%94%AE%C2%A0">                        1.物理外键 </h5> 
  <p>                                概念：使用 foreign key 定义外键关联另外一张表 </p> 
  <p>                              <span style="color:#fe2c24;">  缺点：</span></p> 
  <p><span style="color:#fe2c24;">                                         影响增、删、改的效率（需要检查外键关系）</span></p> 
  <p><span style="color:#fe2c24;">                                         仅用于单节点数据库，不适用与分布式、集群场景</span></p> 
  <p><span style="color:#fe2c24;">                                         容易引发数据库的死锁问题，消耗性能</span></p> 
  <pre><code class="language-sql">外键约束
语法
    创建表时指定
create table 表名(
	字段名    数据类型,
	...
	[constraint]   [外键名称]  foreign  key (外键字段名)   references   主表 (主表列名)	
);


-- 建完表后，添加外键
alter table  表名  add constraint  外键名称  foreign key(外键字段名) references 主表(主表列名);

删除外键
	alter table 表名 drop foreign key 外键名称 ;

外键约束
删除/更新行为
	no action 当在父表中删除/更新对应记录时，首先检查该记录是否有对应外键，如果有则不允许删除/更新（与restrict一致）
	restrict 当在父表中删除/更新对应记录时，首先检查该记录是否有对应外键，如果有则不允许删除/更新（与no action 一致）
	cascade 当在父表中删除/更新对应记录时，首先检查该记录是否有对应外键，如果有，则也删除/更新外键在子表中的记录
	set null 当在父表中删除对应记录时，首先检查该记录是否有对应外键，如果有则设置子表中该外键值为null （这就要求该外键允许取null）
	set default 父表有变更时，子表将外键列设置成一个默认的值（innodb 不支持）

语法
	alter table 表名 add constraint 外键名称 foreign key ( 外键字段 ) references 主表名 ( 主表字段名 ) on update cascade on delete cascade ;
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E9%80%BB%E8%BE%91%E5%A4%96%E9%94%AE%C2%A0">                        2.逻辑外键 </h5> 
  <p>                                概念：在业务层逻辑中，解决外键关联 </p> 
  <p>                                通过逻辑外键，就可以很方便的解决上述问题 </p> 
  <p>                       <span style="color:#fe2c24;"> 注意： </span></p> 
  <p><span style="color:#fe2c24;">                                在现在的企业开发中，很少会使用物理外键（mysql外键），都是使用逻辑外键（java代码）。 甚至在一些数据库开发规范中，会明确指出禁止使用物理外键 foreign key  </span></p> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8817%EF%BC%89%E5%A4%9A%E8%A1%A8%E6%9F%A5%E8%AF%A2%C2%A0">        （17）多表查询 </h4> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.%E6%A6%82%E8%BF%B0%C2%A0">                        1.概述 </h5> 
  <p>                                多表查询: 指从多张表中查询数据 </p> 
  <p>                               笛卡尔积: <span style="color:#38d8f0;">笛卡尔乘积是指在数学中，两个集合(A集合 和 B集合)的所有组合情况。(在多表查询时，需要消除无效的笛卡尔积)</span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/09bfed48da364be8b0b6960743ad485b.jpg" target="_blank"><img alt="JavaWeb_第116张图片" height="183" src="http://img.e-com-net.com/image/info8/09bfed48da364be8b0b6960743ad485b.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E5%88%86%E7%B1%BB%C2%A0">                        2.分类 </h5> 
  <p>                                连接查询： </p> 
  <p>                                        内连接：相当于查询A、B交集部分数据 </p> 
  <p>                                        外连接： </p> 
  <p>                                                左外连接：查询左表所有数据(包括两张表交集部分数据) </p> 
  <p>                                                右外连接：查询右表所有数据(包括两张表交集部分数据) </p> 
  <p>                                        自连接 </p> 
  <p>                                        联合查询 </p> 
  <p>                                        子查询 </p> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/70ebe1cb56ca4ba19ce1e013a1f228ea.jpg" target="_blank"><img alt="JavaWeb_第117张图片" height="164" src="http://img.e-com-net.com/image/info8/70ebe1cb56ca4ba19ce1e013a1f228ea.jpg" width="577" style="border:1px solid black;"></a></p> 
  <p></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E5%86%85%E8%BF%9E%E6%8E%A5%C2%A0">                        3.内连接 </h5> 
  <p>                                 内连接查询的是两张表交集的部分</p> 
  <pre><code class="language-sql">隐式内连接

语法：
	select 字段列表 from 表1 , 表2 where 条件 ... ;

显示内连接

语法：
	select 字段列表 from 表1 [ inner ] join 表2 on 连接条件 ... ;
  </code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E5%A4%96%E8%BF%9E%E6%8E%A5%C2%A0">                        4.外连接 </h5> 
  <pre><code class="language-sql">外连接查询语法

左外连接：
	select 字段列表 from 表1 left [ outer ] join 表2 on 条件 ... ;
相当于查询表1（左表）的所有数据包含表1和表2交集部分的数据

右外连接：
	select 字段列表 from 表1 right [ outer ] join 表2 on 条件 ... ;
相当于查询表2（右表）的所有数据包含表1和表2交集部分的数据</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%205.%E8%87%AA%E8%BF%9E%E6%8E%A5%C2%A0">                        5.自连接 </h5> 
  <pre><code class="language-sql">自连接查询语法：

	select 字段列表 from 表A 别名A join 表A 别名B on 条件 ... ;

    自连接查询，可以是内连接查询，也可以是外连接查询
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%206.%E8%81%94%E5%90%88%E6%9F%A5%E8%AF%A2%C2%A0">                        6.联合查询 </h5> 
  <p>                                对于union 查询，就是把多次查询的结果联合起来，形成一个新的查询结果集</p> 
  <pre><code class="language-sql">联合查询- union  , union all 

对于union 查询，就是把多次查询的结果联合起来，形成一个新的查询结果集

语法：
	select 字段列表 from 表A ...
	union [ all ]
	select 字段列表 from 表B ... ;

对于联合查询的多张表的列数必须保持一致，字段类型也需要保持一致

union all 会将全部数据直接合并在一起，union 会对合并之后的数据去重</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%207.%E5%AD%90%E6%9F%A5%E8%AF%A2%C2%A0">                        7.子查询 </h5> 
  <pre><code class="language-sql">子查询
概念：SQL语句中嵌套select语句，成为嵌套查询，又称为子查询
	select * from t1 where column1 = ( select column1 from t2 ) ;
子查询外部的语句可以是 insert / update / delete/ select

根据子查询结果不同，分为：

    1.标量子查询 （子查询结果为单个值）
    2.列子查询（子查询结果为一列）
    3.行子查询（子查询的结果为一行）
    4.表子查询（子查询的结果为多行多列）

根据子查询的位置，分为：
	where 之后、from 之后、select 之后

标量子查询
子查询返回的结果是单个值（数字、字符串、日期等），最简单的形式，这种子查询称为标量子查询
常用的操作符：= <> > >= < <=

列子查询
子查询返回的结果是一列（可以是多行），这种子查询称为列子查询
常用的操作符：in、not in、any、some、all
	in 在指定的集合范围内，多选一
	not in 不在指定的集合范围之内
	any 子查询返回列表中，有任意一个满足即可
	some 与any 等同 ，使用some的地方都可以使用any
	all 子查询返回列表的所有值都必须满足

行子查询
子查询返回的结果是一行（可以是多列），这种子查询成为行子查询
常用的操作符：=、<>、in、not in 

表子查询
子查询返回的结果是多行多列，这种子查询称为表子查询
常用的操作符：in
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%208.%E6%A1%88%E4%BE%8B%C2%A0">                        8.案例 </h5> 
  <p><a href="http://img.e-com-net.com/image/info8/eef617cbe99e4c93a351946493a332b8.jpg" target="_blank"><img alt="JavaWeb_第118张图片" height="505" src="http://img.e-com-net.com/image/info8/eef617cbe99e4c93a351946493a332b8.jpg" width="650" style="border:1px solid black;"></a></p> 
  <p>                                数据准备： </p> 
  <pre><code class="language-sql">-- 分类表

CREATE TABLE `category` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '主键',
  `type` int DEFAULT NULL COMMENT '类型   1 菜品分类 2 套餐分类',
  `name` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin NOT NULL COMMENT '分类名称',
  `sort` int NOT NULL DEFAULT '0' COMMENT '顺序',
  `status` int DEFAULT NULL COMMENT '分类状态 0:禁用，1:启用',
  `create_time` datetime DEFAULT NULL COMMENT '创建时间',
  `update_time` datetime DEFAULT NULL COMMENT '更新时间',
  `create_user` bigint DEFAULT NULL COMMENT '创建人',
  `update_user` bigint DEFAULT NULL COMMENT '修改人',
  PRIMARY KEY (`id`),
  UNIQUE KEY `idx_category_name` (`name`)
) ENGINE=InnoDB AUTO_INCREMENT=25 DEFAULT CHARSET=utf8mb3 COLLATE=utf8mb3_bin COMMENT='菜品及套餐分类';

-- 菜品表

CREATE TABLE `dish` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '主键',
  `name` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin NOT NULL COMMENT '菜品名称',
  `category_id` bigint NOT NULL COMMENT '菜品分类id',
  `price` decimal(10,2) DEFAULT NULL COMMENT '菜品价格',
  `image` varchar(255) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '图片',
  `description` varchar(255) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '描述信息',
  `status` int DEFAULT '1' COMMENT '0 停售 1 起售',
  `create_time` datetime DEFAULT NULL COMMENT '创建时间',
  `update_time` datetime DEFAULT NULL COMMENT '更新时间',
  `create_user` bigint DEFAULT NULL COMMENT '创建人',
  `update_user` bigint DEFAULT NULL COMMENT '修改人',
  PRIMARY KEY (`id`),
  UNIQUE KEY `idx_dish_name` (`name`)
) ENGINE=InnoDB AUTO_INCREMENT=71 DEFAULT CHARSET=utf8mb3 COLLATE=utf8mb3_bin COMMENT='菜品';

-- 套餐表

CREATE TABLE `setmeal` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '主键',
  `category_id` bigint NOT NULL COMMENT '菜品分类id',
  `name` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin NOT NULL COMMENT '套餐名称',
  `price` decimal(10,2) NOT NULL COMMENT '套餐价格',
  `status` int DEFAULT '1' COMMENT '售卖状态 0:停售 1:起售',
  `description` varchar(255) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '描述信息',
  `image` varchar(255) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '图片',
  `create_time` datetime DEFAULT NULL COMMENT '创建时间',
  `update_time` datetime DEFAULT NULL COMMENT '更新时间',
  `create_user` bigint DEFAULT NULL COMMENT '创建人',
  `update_user` bigint DEFAULT NULL COMMENT '修改人',
  PRIMARY KEY (`id`),
  UNIQUE KEY `idx_setmeal_name` (`name`)
) ENGINE=InnoDB AUTO_INCREMENT=107 DEFAULT CHARSET=utf8mb3 COLLATE=utf8mb3_bin COMMENT='套餐';

-- 套餐菜品关联表

CREATE TABLE `setmeal_dish` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '主键',
  `setmeal_id` bigint DEFAULT NULL COMMENT '套餐id',
  `dish_id` bigint DEFAULT NULL COMMENT '菜品id',
  `name` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '菜品名称',
  `price` decimal(10,2) DEFAULT NULL COMMENT '菜品单价',
  `copies` int DEFAULT NULL COMMENT '菜品份数',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=59 DEFAULT CHARSET=utf8mb3 COLLATE=utf8mb3_bin COMMENT='套餐菜品关系';</code></pre> 
  <p>                                添加测试数据： </p> 
  <pre><code class="language-sql">-- category

INSERT INTO `category`
VALUES (11, 1, '酒水饮料', 10, 1, '2022-06-09 22:09:18', '2022-06-09 22:09:18', 1, 1),
       (12, 1, '传统主食', 9, 1, '2022-06-09 22:09:32', '2022-06-09 22:18:53', 1, 1),
       (13, 2, '人气套餐', 12, 1, '2022-06-09 22:11:38', '2022-06-10 11:04:40', 1, 1),
       (15, 2, '商务套餐', 13, 1, '2022-06-09 22:14:10', '2022-06-10 11:04:48', 1, 1),
       (16, 1, '蜀味烤鱼', 4, 1, '2022-06-09 22:15:37', '2022-08-31 14:27:25', 1, 1),
       (17, 1, '蜀味牛蛙', 5, 1, '2022-06-09 22:16:14', '2022-08-31 14:39:44', 1, 1),
       (18, 1, '特色蒸菜', 6, 1, '2022-06-09 22:17:42', '2022-06-09 22:17:42', 1, 1),
       (19, 1, '新鲜时蔬', 7, 1, '2022-06-09 22:18:12', '2022-06-09 22:18:28', 1, 1),
       (20, 1, '水煮鱼', 8, 1, '2022-06-09 22:22:29', '2022-06-09 22:23:45', 1, 1),
       (21, 1, '汤类', 11, 1, '2022-06-10 10:51:47', '2022-06-10 10:51:47', 1, 1),
       (23, 1, '云南菜', 1, 1, '2023-11-17 10:54:58', '2023-11-17 10:54:58', 1, 1),
       (24, 2, '节假日套餐', 1, 1, '2023-11-17 11:36:12', '2023-11-17 11:36:12', 1, 1);

-- dish

INSERT INTO `dish`
VALUES (46, '王老吉', 11, 6.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/41bfcacf-7ad4-4927-8b26-df366553a94c.png',
        '', 1, '2022-06-09 22:40:47', '2022-06-09 22:40:47', 1, 1),
       (47, '北冰洋', 11, 4.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/4451d4be-89a2-4939-9c69-3a87151cb979.png',
        '还是小时候的味道', 1, '2022-06-10 09:18:49', '2022-06-10 09:18:49', 1, 1),
       (48, '雪花啤酒', 11, 4.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/bf8cbfc1-04d2-40e8-9826-061ee41ab87c.png',
        '', 1, '2022-06-10 09:22:54', '2022-06-10 09:22:54', 1, 1),
       (49, '米饭', 12, 2.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/76752350-2121-44d2-b477-10791c23a8ec.png',
        '精选五常大米', 1, '2022-06-10 09:30:17', '2022-06-10 09:30:17', 1, 1),
       (50, '馒头', 12, 1.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/475cc599-8661-4899-8f9e-121dd8ef7d02.png',
        '优质面粉', 1, '2022-06-10 09:34:28', '2022-06-10 09:34:28', 1, 1),
       (51, '老坛酸菜鱼', 20, 56.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/4a9cefba-6a74-467e-9fde-6e687ea725d7.png', '原料：汤，草鱼，酸菜', 1,
        '2022-06-10 09:40:51', '2022-06-10 09:40:51', 1, 1),
       (52, '经典酸菜鮰鱼', 20, 66.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/5260ff39-986c-4a97-8850-2ec8c7583efc.png', '原料：酸菜，江团，鮰鱼', 1,
        '2022-06-10 09:46:02', '2022-06-10 09:46:02', 1, 1),
       (53, '蜀味水煮草鱼', 20, 38.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/a6953d5a-4c18-4b30-9319-4926ee77261f.png', '原料：草鱼，汤', 1,
        '2022-06-10 09:48:37', '2022-06-10 09:48:37', 1, 1),
       (54, '清炒小油菜', 19, 18.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/3613d38e-5614-41c2-90ed-ff175bf50716.png', '原料：小油菜', 1,
        '2022-06-10 09:51:46', '2022-06-10 09:51:46', 1, 1),
       (55, '蒜蓉娃娃菜', 19, 18.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/4879ed66-3860-4b28-ba14-306ac025fdec.png', '原料：蒜，娃娃菜', 1,
        '2022-06-10 09:53:37', '2022-06-10 09:53:37', 1, 1),
       (56, '清炒西兰花', 19, 18.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/e9ec4ba4-4b22-4fc8-9be0-4946e6aeb937.png', '原料：西兰花', 1,
        '2022-06-10 09:55:44', '2022-06-10 09:55:44', 1, 1),
       (57, '炝炒圆白菜', 19, 18.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/22f59feb-0d44-430e-a6cd-6a49f27453ca.png', '原料：圆白菜', 1,
        '2022-06-10 09:58:35', '2022-06-10 09:58:35', 1, 1),
       (58, '清蒸鲈鱼', 18, 98.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/c18b5c67-3b71-466c-a75a-e63c6449f21c.png', '原料：鲈鱼', 1,
        '2022-06-10 10:12:28', '2022-06-10 10:12:28', 1, 1),
       (59, '东坡肘子', 18, 138.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/a80a4b8c-c93e-4f43-ac8a-856b0d5cc451.png', '原料：猪肘棒', 1,
        '2022-06-10 10:24:03', '2022-06-10 10:24:03', 1, 1),
       (60, '梅菜扣肉', 18, 58.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/6080b118-e30a-4577-aab4-45042e3f88be.png', '原料：猪肉，梅菜', 1,
        '2022-06-10 10:26:03', '2022-06-10 10:26:03', 1, 1),
       (61, '剁椒鱼头', 18, 66.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/13da832f-ef2c-484d-8370-5934a1045a06.png', '原料：鲢鱼，剁椒', 1,
        '2022-06-10 10:28:54', '2022-06-10 10:28:54', 1, 1),
       (62, '金汤酸菜牛蛙', 17, 88.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/7694a5d8-7938-4e9d-8b9e-2075983a2e38.png', '原料：鲜活牛蛙，酸菜', 1,
        '2022-06-10 10:33:05', '2022-06-10 10:33:05', 1, 1),
       (63, '香锅牛蛙', 17, 88.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/f5ac8455-4793-450c-97ba-173795c34626.png', '配料：鲜活牛蛙，莲藕，青笋', 1,
        '2022-06-10 10:35:40', '2022-06-10 10:35:40', 1, 1),
       (64, '馋嘴牛蛙', 17, 88.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/7a55b845-1f2b-41fa-9486-76d187ee9ee1.png', '配料：鲜活牛蛙，丝瓜，黄豆芽', 1,
        '2022-06-10 10:37:52', '2022-06-10 10:37:52', 1, 1),
       (65, '草鱼2斤', 16, 68.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/b544d3ba-a1ae-4d20-a860-81cb5dec9e03.png', '原料：草鱼，黄豆芽，莲藕', 1,
        '2022-06-10 10:41:08', '2022-06-10 10:41:08', 1, 1),
       (66, '江团鱼2斤', 16, 119.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/a101a1e9-8f8b-47b2-afa4-1abd47ea0a87.png', '配料：江团鱼，黄豆芽，莲藕', 1,
        '2022-06-10 10:42:42', '2022-06-10 10:42:42', 1, 1),
       (67, '鮰鱼2斤', 16, 72.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/8cfcc576-4b66-4a09-ac68-ad5b273c2590.png', '原料：鮰鱼，黄豆芽，莲藕', 1,
        '2022-06-10 10:43:56', '2022-06-10 10:43:56', 1, 1),
       (68, '鸡蛋汤', 21, 4.00, 'https://sky-itcast.oss-cn-beijing.aliyuncs.com/c09a0ee8-9d19-428d-81b9-746221824113.png',
        '配料：鸡蛋，紫菜', 1, '2022-06-10 10:54:25', '2022-06-10 10:54:25', 1, 1),
       (69, '平菇豆腐汤', 21, 6.00,
        'https://sky-itcast.oss-cn-beijing.aliyuncs.com/16d0a3d6-2253-4cfc-9b49-bf7bd9eb2ad2.png', '配料：豆腐，平菇', 1,
        '2022-06-10 10:55:02', '2022-06-10 10:55:02', 1, 1),
       (70, '水性杨花菜', 23, 10.00, '1.jpg', '夏季必备，清热爽口', 1, '2023-11-17 11:02:46', '2023-11-17 11:02:46', 1, 1);

-- setmeal

INSERT INTO `setmeal`
VALUES (105, 24, '元旦节8人餐', 5000.00, 1, '好吃不贵，分量足够', '1.jpg', '2023-11-17 12:08:27', '2023-11-17 12:08:27', 1, 1),
       (106, 24, '圣诞节2人烛光晚餐', 200.00, 1, '浪漫极了', '1.jpg', '2023-11-17 12:12:10', '2023-11-17 12:12:10', 1, 1);

-- setmeal_dish

INSERT INTO `setmeal_dish`
VALUES (50, 105, 46, '王老吉', 6.00, 8),
       (51, 105, 51, '老坛酸菜鱼', 56.00, 1),
       (52, 105, 49, '米饭', 2.00, 8),
       (53, 105, 59, '东坡肘子', 138.00, 1),
       (54, 105, 58, '清蒸鲈鱼', 98.00, 2),
       (55, 105, 62, '金汤酸菜牛蛙', 88.00, 2),
       (56, 106, 49, '米饭', 2.00, 2),
       (57, 106, 58, '清蒸鲈鱼', 98.00, 1),
       (58, 106, 48, '雪花啤酒', 4.00, 2);</code></pre> 
  <p>                                sql语句： </p> 
  <pre><code class="language-sql">#1.查询价格低于 10元 的菜品的名称 、价格 及其 菜品的分类名称
select dish.name, dish.price, category.name
from dish,
     category
where dish.category_id = category.id
  and dish.price < 10;

#2.查询所有价格在 10元(含)到50元(含)之间 且 状态为"起售"的菜品名称、价格及其分类名称(即使菜品没有分类 , 也要将菜品查询出来)
select dish.name, dish.price, category.name
from dish
         left join category on dish.category_id = category.id
where dish.price between 10 and 50
  and dish.status = 1;

#3.查询每个分类下最贵的菜品, 展示出分类的名称、最贵的菜品的价格
select category.name,max(dish.price) from dish join category on dish.category_id = category.id group by category.name;

#4.查询各个分类下 菜品状态为 "起售" , 并且 该分类下菜品总数量大于等于3 的 分类名称
select category.name, count(*)
from dish
         join category on dish.category_id = category.id
group by category.name
having count(*) > 3;

#5.查询出 "元旦节8人餐" 中包含了哪些菜品 （展示出套餐名称、价格, 包含的菜品名称、价格、份数）
select setmeal.name, setmeal.price, dish.name, dish.price,setmeal_dish.copies
from dish
         join setmeal_dish on dish.id = setmeal_dish.dish_id
         join setmeal on setmeal.id = setmeal_dish.setmeal_id
where setmeal.name = '元旦节8人餐';

#6.查询出低于菜品平均价格的菜品信息 (展示出菜品名称、菜品价格)
select dish.name,dish.price from dish where dish.price < ( select avg(dish.price) from dish);</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8818%EF%BC%89%E4%BA%8B%E7%89%A9%C2%A0">        （18）事物 </h4> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%201.%E4%BB%8B%E7%BB%8D%C2%A0">                        1.介绍 </h5> 
  <p>                                事务 是一组操作的集合，它是一个<span style="color:#fe2c24;">不可分割的工作单位</span>。事务会把所有的操作作为一个整体一起向系统提交或撤销操作请求，即这些操作 <span style="color:#fe2c24;">要么同时成功，要么同时失败</span> </p> 
  <p>                                注意事项： </p> 
  <p>                                        <span style="color:#fe2c24;">默认MySQL的事务是自动提交的</span>，也就是说，当执行一条DML语句，MySQL会立即隐式的提交事务 </p> 
  <pre><code class="language-sql">事务操作：

查看/设置事务提交方式
	select @@autocommit ;
	set @@autocommit = 0 ;

提交事务
	commit ;

回滚事务
	rollback ;

开启事务
	start transaction 或 begin ;

提交事务
	commit ;

回滚事务
	rollback ;</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E5%9B%9B%E5%A4%A7%E7%89%B9%E6%80%A7%C2%A0">                        2.四大特性 </h5> 
  <p class="img-center"><a href="http://img.e-com-net.com/image/info8/c72b8c6c3b9a489cb5859369795d1af1.jpg" target="_blank"><img alt="JavaWeb_第119张图片" height="276" src="http://img.e-com-net.com/image/info8/c72b8c6c3b9a489cb5859369795d1af1.jpg" width="650" style="border:1px solid black;"></a></p> 
  <pre><code class="language-sql">事务的四大特性：

	原子性( atomicity ) ：事务是不可分割的最小操作单元，要么全部成功，要么全部失败

	一致性（consistency）:事务完成时，必须使所有的数据都保持一致状态

	隔离性（isolation）:数据库系统提供的隔离机制，保证事务在不受外部并发操作影响的独立环境下运行

	持久性（durability）：事务一旦提交或回滚，它对数据库的数据的改变就是永久的
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E4%BA%8B%E7%89%A9%E7%9A%84%E5%B9%B6%E5%8F%91%E9%97%AE%E9%A2%98%C2%A0">                        3.事物的并发问题 </h5> 
  <pre><code class="language-sql">并发事务问题：

    脏读	一个事务读到另一个事务还没有提交的数据

    不可重复读	一个事务先后读取同一条记录，但两次读取的数据不同，称为不可重复读

    幻读	一个事务按照条件查询数据时，没有对应的数据行，但是在插入数据时，又发现这行数据已经存在了，好像出现了幻影
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E4%BA%8B%E5%8A%A1%E9%9A%94%E7%A6%BB%E7%BA%A7%E5%88%AB%C2%A0">                        4.事务隔离级别 </h5> 
  <pre><code class="language-sql">事务隔离级别:

	      隔离级别	               脏读	      不可重复读	     幻读

	    read uncommitted             v		    v	           v
    
	    read committed	             x	 	    v	           v

	    repeatable read(默认)        x	 	    x	           v

	    serializable	             x 	 	    x	           x

查看事务隔离级别：
	select @@transaction_isolation

设置事务隔离级别：
	set [ session | globle ] transaction isolation level { read uncommitted | read committed |repeatable read | serializable }
</code></pre> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%205.%E5%AD%98%E5%82%A8%E5%BC%95%E6%93%8E%C2%A0">                        5.存储引擎 </h5> 
  <pre><code class="language-sql">存储引擎

体系结构
	连接层、服务层、引擎层、存储层	

在创建表时，指定存储引擎
	create table 表名(
	字段1  字段1类型 [ comment 字段1注释 ] ,
	.......
	字段n 字段n类型  [ comment 字段n注释 ] 
	)engine = innodb [ comment 表注释 ] ;
 
查看当前数据库支持的存储引擎
	show engines ;

存储引擎特点
innodb
	特点：
	DML操作遵循ACID模型，支持事务；
	行级锁，提高并发访问性能；
	支持外键	foreign key约束，保证数据的完整性和正确性；
xxx.idb : xxx代表的时表名，innodb 引擎的每一张表都会对应这样一个表空间文件，存储该表的表结构（from  sdi ）、数据、和索引
参数：innodb_file_per_table

	tablespece :表空间
	segment ：段
	extent ：区
	page ：页
	row ：行

MyISAM
特点：
	不支持事务，不支持外键
	支持表锁，不支持行锁
	访问速度快
文件：
	xxx.sid ：存储表结构信息
	xxx.MYD ：存储数据
	xxx.MYI :存储索引

Memory
特点：
	内存存放
	hash索引（默认）
文件：
	xxx.sid ：存储表结构信息</code></pre> 
  <h4 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%EF%BC%8819%EF%BC%89%E7%B4%A2%E5%BC%95%C2%A0">        （19）索引 </h4> 
  <h5>                        1.介绍 </h5> 
  <p>                                <span style="color:#fe2c24;">索引（index）是帮助数据库 高效获取数据 的 数据结构 </span></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%202.%E4%BC%98%E7%BC%BA%E7%82%B9%C2%A0">                        2.优缺点 </h5> 
  <p><a href="http://img.e-com-net.com/image/info8/c6343421cfc541b78c07ca7a58a6f450.jpg" target="_blank"><img alt="JavaWeb_第120张图片" height="282" src="http://img.e-com-net.com/image/info8/c6343421cfc541b78c07ca7a58a6f450.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%203.%E7%B4%A2%E5%BC%95%E7%BB%93%E6%9E%84%C2%A0">                        3.索引结构 </h5> 
  <p>                                MySQL数据库支持的索引结构有很多，如：<span style="color:#fe2c24;">Hash索引、B+Tree索引、Full-Text索引</span>等。我们平常所说的索引，如果没有特别指明，都是指<span style="color:#38d8f0;">默认的 B+Tree 结构组织的索引 </span></p> 
  <pre><code class="language-sql">索引结构：

	B+Tree索引 ：最常见的索引类型，大部分引擎都支持B+树索引

	hash索引： 底层数据结构是用哈希表实现的，只有精确匹配索引列的查询才有效，不支持范围查询

	R-Tree（空间索引）： 空间索引是MyISAM引擎的一个特殊索引类型，主要用于地理空间数据类型，通常使用很少

	Full-text（全文索引）：是通过建立倒排索引，快速匹配文档的方式。类似于Lucene,Solr,ES
</code></pre> 
  <p><a href="http://img.e-com-net.com/image/info8/a15f7fc7eb1e44ce8e17c9a14c003bae.jpg" target="_blank"><img alt="JavaWeb_第121张图片" height="282" src="http://img.e-com-net.com/image/info8/a15f7fc7eb1e44ce8e17c9a14c003bae.jpg" width="650" style="border:1px solid black;"></a></p> 
  <h5 id="%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%20%C2%A0%204.%E7%B4%A2%E5%BC%95%E8%AF%AD%E6%B3%95%C2%A0">                        4.索引语法 </h5> 
  <pre><code class="language-sql">创建索引：
	create [ unique | fulltext ] index index_name on table_name ( index_col_name , ... ) ;

查看索引：
	show index from table_name ;

删除索引：
	drop index index_name on table_name ;

注意事项：
    1.主键字段，在建表时，会自动创建主键索引
    2.添加唯一约束时，数据库实际上会添加唯一索引
	
</code></pre> 
  <p></p> 
  <p></p> 
 </div> 
</div>
                            </div>
                        </div>
                    </div>
                    <!--PC和WAP自适应版-->
                    <div id="SOHUCS" sid="1757768135127089152"></div>
                    <script type="text/javascript" src="/views/front/js/chanyan.js"></script>
                    <!-- 文章页-底部 动态广告位 -->
                    <div class="youdao-fixed-ad" id="detail_ad_bottom"></div>
                </div>
                <div class="col-md-3">
                    <div class="row" id="ad">
                        <!-- 文章页-右侧1 动态广告位 -->
                        <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_1"> </div>
                        </div>
                        <!-- 文章页-右侧2 动态广告位 -->
                        <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_2"></div>
                        </div>
                        <!-- 文章页-右侧3 动态广告位 -->
                        <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_3"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(web)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1773602697044361216.htm"
                           title="浪潮 M5系列服务器IPMI无法监控存储RAID卡问题." target="_blank">浪潮 M5系列服务器IPMI无法监控存储RAID卡问题.</a>
                        <span class="text-muted">Songxwn</span>
<a class="tag" taget="_blank" href="/search/%E7%A1%AC%E4%BB%B6%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">硬件服务器</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>简介浪潮的M5代服务器，可能有WebBMC无法查看存储RAID/SAS卡状态的情况，可以通过以下方式修改。修改完成后重启BMC即可生效。ESXiIPMITools使用：https://songxwn.com/ESXi8_IPMI/（Linux也可以直接使用）Linux/ESXiIPMITool下载：https://songxwn.com/file/ipmitoolWindows下载：https:/</div>
                    </li>
                    <li><a href="/article/1773510684068347904.htm"
                           title="请简单介绍一下Shiro框架是什么？Shiro在Java安全领域的主要作用是什么？Shiro主要提供了哪些安全功能？" target="_blank">请简单介绍一下Shiro框架是什么？Shiro在Java安全领域的主要作用是什么？Shiro主要提供了哪些安全功能？</a>
                        <span class="text-muted">AaronWang94</span>
<a class="tag" taget="_blank" href="/search/shiro/1.htm">shiro</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>请简单介绍一下Shiro框架是什么？Shiro框架是一个强大且灵活的开源安全框架，为Java应用程序提供了全面的安全解决方案。它主要用于身份验证、授权、加密和会话管理等功能，可以轻松地集成到任何JavaWeb应用程序中，并提供了易于理解和使用的API，使开发人员能够快速实现安全特性。Shiro的核心组件包括Subject、SecurityManager和Realms。Subject代表了当前与应用</div>
                    </li>
                    <li><a href="/article/1773495574226599936.htm"
                           title="3、JavaWeb-Ajax/Axios-前端工程化-Element" target="_blank">3、JavaWeb-Ajax/Axios-前端工程化-Element</a>
                        <span class="text-muted">所谓远行Misnearch</span>
<a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/JavaWeb/1.htm">JavaWeb</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/elementui/1.htm">elementui</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>P34Ajax介绍Ajax:AsynchroousJavaScriptAndXML，异步的JS和XMLJS网页动作，XML一种标记语言，存储数据，作用：数据交换：通过Ajax给服务器发送请求，并获取服务器响应的数据异步交互：在不重新加载整个页面的情况下，与服务器交换数据并实现更新部分网页的技术，例如：搜索联想、用户名是否可用的校验等等。同步与异步：同步：服务器在处理中客户端要处于等待状态，输入域名</div>
                    </li>
                    <li><a href="/article/1773495447948689408.htm"
                           title="docker怎么端口映射" target="_blank">docker怎么端口映射</a>
                        <span class="text-muted">Lance_mu</span>
<a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a><a class="tag" taget="_blank" href="/search/%E5%AE%B9%E5%99%A8/1.htm">容器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>1、默认固定的端口#Web服务器：WebApache或Nginx通常使用80端口HTTP：80HTTPS：443#数据库服务器MySQL：3306PostgreSQL：5432MongoDB：27017Redis：6379#邮件服务器SMTP：25POP3：110IMAP：143#其他服务SSH：22FTP：21DNS（域名解析）：53代理服务器Squid：3128版本控制系统Git：9418(S</div>
                    </li>
                    <li><a href="/article/1773471029155397632.htm"
                           title="网络安全（黑客）——自学2024" target="_blank">网络安全（黑客）——自学2024</a>
                        <span class="text-muted">小言同学喜欢挖漏洞</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a><a class="tag" taget="_blank" href="/search/%E6%B8%97%E9%80%8F%E6%B5%8B%E8%AF%95/1.htm">渗透测试</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773470776930926592.htm"
                           title="黑客（网络安全）技术自学30天" target="_blank">黑客（网络安全）技术自学30天</a>
                        <span class="text-muted">一个迷人的黑客</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a><a class="tag" taget="_blank" href="/search/%E6%B8%97%E9%80%8F%E6%B5%8B%E8%AF%95/1.htm">渗透测试</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773408210510741504.htm"
                           title="webpack.prod.js（webpack生产环境配置文件）" target="_blank">webpack.prod.js（webpack生产环境配置文件）</a>
                        <span class="text-muted">门板_</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>生产环境：只打包不运行本地服务器对于在config目录下的webpack.prod.js1.在根目录下运行npxwebpack--config./config/webpack.prod.js2.在package.json文件中配置"build":"npxwebpack--config./config/webpack.prod.js"constpath=require('path')constESL</div>
                    </li>
                    <li><a href="/article/1773389331080216576.htm"
                           title="VUE 页面禁止缩放（华为平板浏览器可能失效）" target="_blank">VUE 页面禁止缩放（华为平板浏览器可能失效）</a>
                        <span class="text-muted">唐屁屁儿</span>
<a class="tag" taget="_blank" href="/search/JS/1.htm">JS</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/webview/1.htm">webview</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>h5页面移动端禁止缩放、web页面禁止浏览器缩放移动端优先，可禁止用户缩放和双击放大；在App.vue中的script内的方法里加入以下代码：window.onload=function(){document.addEventListener('touchstart',function(event){if(event.touches.length>1){event.preventDefault()</div>
                    </li>
                    <li><a href="/article/1773347793847517184.htm"
                           title="UNDERSTANDING HTML WITH LARGE LANGUAGE MODELS" target="_blank">UNDERSTANDING HTML WITH LARGE LANGUAGE MODELS</a>
                        <span class="text-muted">liferecords</span>
<a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">语言模型</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E5%A4%84%E7%90%86/1.htm">自然语言处理</a>
                        <div>UNDERSTANDINGHTMLWITHLARGELANGUAGEMODELS相关链接：arXiv关键字：大型语言模型、HTML理解、Web自动化、自然语言处理、机器学习摘要大型语言模型（LLMs）在各种自然语言任务上表现出色。然而，它们在HTML理解方面的能力——即解析网页的原始HTML，对于自动化基于Web的任务、爬取和浏览器辅助检索等应用——尚未被充分探索。我们为HTML理解模型（经过微调</div>
                    </li>
                    <li><a href="/article/1773347164047605760.htm"
                           title="自学黑客（网络安全）技术——2024最新" target="_blank">自学黑客（网络安全）技术——2024最新</a>
                        <span class="text-muted">九九归二</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773344429185236992.htm"
                           title="Webpack构建优化——区分环境" target="_blank">Webpack构建优化——区分环境</a>
                        <span class="text-muted">oWSQo</span>

                        <div>为什么需要区分环境在开发网页的时候，一般都会有多套运行环境，例如：在开发过程中方便开发调试的环境。发布到线上给用户使用的运行环境。这两套不同的环境虽然都是由同一套源代码编译而来，但是代码内容却不一样，差异包括：线上代码被特殊压缩过。开发用的代码包含一些用于提示开发者的提示日志，这些日志普通用户不可能去看它。开发用的代码所连接的后端数据接口地址也可能和线上环境不同，因为要避免开发过程中造成对线上数据</div>
                    </li>
                    <li><a href="/article/1773308900838277120.htm"
                           title="Web前端Html的表单" target="_blank">Web前端Html的表单</a>
                        <span class="text-muted">任家伟</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a>
                        <div>表单的关键字：form标签表示一个表单区域action=“后端地址”method=“提交数据方式:get/post”input单行输入框type=“text”文本name=“定义名称名字自定义”向后端提交的键readonly=“readonly”只读，不可修改，但是可以提交disabled=“disabled”禁用组件不可修改，不能提交type=“password”密码框type=“radio”单</div>
                    </li>
                    <li><a href="/article/1773279695408791552.htm"
                           title="Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）" target="_blank">Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）</a>
                        <span class="text-muted">王佳斌</span>
<a class="tag" taget="_blank" href="/search/%2B/1.htm">+</a><a class="tag" taget="_blank" href="/search/Thinkphp/1.htm">Thinkphp</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a>
                        <div>前言登录功能，是我们几乎开发每个系统都必须的模块。登录功能设计思路，主要包括几个方面。用户输入网址展示登录页面用户输入用户名，密码等点击登录进行信息校验校验通过之后，记录用户登录信息，跳转指定页面用户校验失败，提示失败信息页面目录具体功能实现为了快速搭建可用、美观的页面，我们采用一个比较成熟的前端框架Bootstrap。下面我们到Bootstrap的官网Bootsrap官网下载bootstrap。</div>
                    </li>
                    <li><a href="/article/1773191331473063936.htm"
                           title="JSON与AJAX：网页交互的利器" target="_blank">JSON与AJAX：网页交互的利器</a>
                        <span class="text-muted">入冉心</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>在现代Web开发中，JSON（JavaScriptObjectNotation）和AJAX（AsynchronousJavaScriptandXML）是两项不可或缺的技术。它们共同为网页提供了动态、实时的数据交互能力，为用户带来了更加流畅和丰富的体验。本文将详细介绍JSON和AJAX的概念、原理，并通过代码示例展示它们在实际开发中的应用。一、JSON：轻量级的数据交换格式JSON是一种轻量级的数据</div>
                    </li>
                    <li><a href="/article/1772795036136701952.htm"
                           title="程序员开发技术整理" target="_blank">程序员开发技术整理</a>
                        <span class="text-muted">laizhixue</span>
<a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>前端技术：vue-前端框架element-前端框架bootstrap-前端框架echarts-图标组件C#后端技术：webservice：soap架构：简单的通信协议，用于服务通信ORM框架：对象关系映射，如EF：对象实体模型，是ado.net中的应用技术soap服务通讯：xml通讯ado.net：OAuth2:登录授权认证：Token认证：JWT：jsonwebtokenJava后端技术：便捷工</div>
                    </li>
                    <li><a href="/article/1772775523957669888.htm"
                           title="centos7 安装influxdb+telegraf+grafana 监控服务器" target="_blank">centos7 安装influxdb+telegraf+grafana 监控服务器</a>
                        <span class="text-muted">吕吕-lvlv</span>
<a class="tag" taget="_blank" href="/search/grafana/1.htm">grafana</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>influxdbinfluxdb是一个时间序列数据库,所有数据记录都会打上时间戳,适合存储数字类型的内容telegraftelegraf可以用于收集系统和服务的统计数据并发送到influxdbgrafanagrafana是一个界面非常漂亮,可直接读取influxdb数据展示成各种图表的开源可视化web软件安装并启动influxdb数据库vim/etc/yum.repos.d/influxdb.re</div>
                    </li>
                    <li><a href="/article/1772773132000624640.htm"
                           title="【前端学习——js篇】7.函数缓存" target="_blank">【前端学习——js篇】7.函数缓存</a>
                        <span class="text-muted">笔下无竹墨下有鱼</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%AD%A6%E4%B9%A0/1.htm">前端学习</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>具体见：https://github.com/febobo/web-interview7.函数缓存函数缓存，就是将函数运算过的结果进行缓存本质上就是用空间（缓存存储）换时间（计算过程）常用于缓存数据计算结果和缓存对象。其实现主要通过闭包、柯里化和高阶函数。下面主要介绍下柯里化：①柯里化柯里化（currying)是一种函数式编程的概念，指的是将一个带有多个参数的函数转换成一系列只接受一个参数的函数的</div>
                    </li>
                    <li><a href="/article/1772718755147743232.htm"
                           title="Python自动化测试web常见框架汇总" target="_blank">Python自动化测试web常见框架汇总</a>
                        <span class="text-muted">自动化测试薰儿</span>
<a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E6%B5%8B%E8%AF%95/1.htm">软件测试</a><a class="tag" taget="_blank" href="/search/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/1.htm">技术分享</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>1、前言目前，有非常多的Python框架，用来帮助你更轻松的创建web应用。这些框架把相应的模块组织起来，使得构建应用的时候可以更快捷，也不用去关注一些细节（例如socket和协议），所以需要的都在框架里了。接下来我们会介绍不同的选项。经过初期的不起眼，Python已经成为互联网最流行的服务端编程语言之一。根据W3Techs的统计，它被用于很多的大流量的站点很多的大流量的站点很多的大流量的站点，超</div>
                    </li>
                    <li><a href="/article/1772709062681624576.htm"
                           title="html版本号 webpack_html-webpack-plugin详解" target="_blank">html版本号 webpack_html-webpack-plugin详解</a>
                        <span class="text-muted">weixin_39994949</span>
<a class="tag" taget="_blank" href="/search/html%E7%89%88%E6%9C%AC%E5%8F%B7/1.htm">html版本号</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a>
                        <div>引言最近在react项目中初次用到了html-webapck-plugin插件，用到该插件的两个主要作用：为html文件中引入的外部资源如script、link动态添加每次compile后的hash，防止引用缓存的外部文件问题可以生成创建html入口文件，比如单页面可以生成一个html文件入口，配置N个html-webpack-plugin可以生成N个页面入口有了这种插件，那么在项目中遇到类似上面</div>
                    </li>
                    <li><a href="/article/1772690935436607488.htm"
                           title="webpack-loader详解" target="_blank">webpack-loader详解</a>
                        <span class="text-muted">奶昔不会射手</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a>
                        <div>一、loader的分类1.pre:前置loader2.normal:普通loader3.inline:内联loader4.post:后置loader二、执行顺序pre>normal>inline>post,相同类型的loader执行顺序为：从右到左，从下到上module:{rules:[{enforce:"pre",//通过这个参数来定义loader的类型，默认是normal类型test:/\.j</div>
                    </li>
                    <li><a href="/article/1772673815097180160.htm"
                           title="Websocket服务监听收发消息" target="_blank">Websocket服务监听收发消息</a>
                        <span class="text-muted">beiback</span>
<a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%97%AE%E9%A2%98/1.htm">服务器问题</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/1.htm">网络协议</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a>
                        <div>目录1.pom依赖坐标2.项目配置端口和项目包名2.创建处理器3.注册处理器4.前端页面1.pom依赖坐标org.springframework.bootspring-boot-starter-websocket2.项目配置端口和项目包名application.propertiesserver.port=8088//路径规范：为应用的所有servlet提供一个统一的前缀，使URL结构更加清晰和一致</div>
                    </li>
                    <li><a href="/article/1772673816238030848.htm"
                           title="Netty服务器结合WebSocke协议监听和接收数据" target="_blank">Netty服务器结合WebSocke协议监听和接收数据</a>
                        <span class="text-muted">beiback</span>
<a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%97%AE%E9%A2%98/1.htm">服务器问题</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/netty/1.htm">netty</a>
                        <div>目录1.pom依赖2.配置属性3.创建netty服务器4.建立监听和响应5.创建启动器6.前端static下页面7.前端js8.注意异常问题9.创建netty服务器--使用守护线程1.pom依赖io.nettynetty-all4.1.86.Final2.配置属性application.properties#启动端口server.port=8088server.servlet.context-pa</div>
                    </li>
                    <li><a href="/article/1772639324207120384.htm"
                           title="java selenium 元素点击不了" target="_blank">java selenium 元素点击不了</a>
                        <span class="text-muted">马达马达达</span>
<a class="tag" taget="_blank" href="/search/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a>
                        <div>最近做了一个页面爬取，很有意思被机缘巧合下解决了。这个元素很奇怪，用xpath可以定位元素，但是就是click()不了。试过了网上搜的一些办法：//尝试一WebElementa_tag=driver.findElement(By.xpath("xxx"));a_tag.click();//点击不了，卡住//尝试二WebDriverWaitwait=newWebDriverWait(driver,1</div>
                    </li>
                    <li><a href="/article/1772631263593693184.htm"
                           title="javascript实现SM2加密解密" target="_blank">javascript实现SM2加密解密</a>
                        <span class="text-muted">人生在勤，不索何获</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a>
                        <div>前提JavaWeb环境前端代码window.sm2=function(t){functioni(e){if(r[e])returnr[e].exports;varn=r[e]={i:e,l:!1,exports:{}};returnt[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}varr={};returni.m=t,i.c=r,i.d=fu</div>
                    </li>
                    <li><a href="/article/1772550330626670592.htm"
                           title="SQL运维_Unix下MySQL-8.0.18配置文件示例" target="_blank">SQL运维_Unix下MySQL-8.0.18配置文件示例</a>
                        <span class="text-muted">Mostcow</span>
<a class="tag" taget="_blank" href="/search/SQL/1.htm">SQL</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/unix/1.htm">unix</a>
                        <div>SQL运维_Unix下MySQL-8.0.18配置文件示例MySQL是一个关系型数据库管理系统,由瑞典MySQLAB公司开发,属于Oracle旗下产品。MySQL是最流行的关系型数据库管理系统之一,在WEB应用方面,MySQL是最好的RDBMS(RelationalDatabaseManagementSystem,关系数据库管理系统)应用软件之一。MySQL是一种关系型数据库管理系统,关系数据库将</div>
                    </li>
                    <li><a href="/article/1772511560346959872.htm"
                           title="C#使用ASP.NET Core Razor Pages构建网站（二）" target="_blank">C#使用ASP.NET Core Razor Pages构建网站（二）</a>
                        <span class="text-muted">林祖师</span>
<a class="tag" taget="_blank" href="/search/C%23/1.htm">C#</a><a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</a><a class="tag" taget="_blank" href="/search/asp.net/1.htm">asp.net</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>上一篇文章讲了HTTP协议的基本概念、客户端Web开发技术以及ASP.NETCore框架的关键特点和创建项目方法链接：C#使用ASP.NETCoreRazorPages构建网站（一）接下来继续了解ASP.NETCoreRazorPages构建网站的后续内容了解RazorPagesRazorPages允许开发人员轻松地将HTML标记和C#代码混合在一起，这是使用.cshtml扩展名的原因。默认情况下</div>
                    </li>
                    <li><a href="/article/1772492045785563136.htm"
                           title="总结近一年折腾的那些事情-致敬Frp神器" target="_blank">总结近一年折腾的那些事情-致敬Frp神器</a>
                        <span class="text-muted">WarmSword</span>
<a class="tag" taget="_blank" href="/search/%E5%B7%A5%E5%85%B7/1.htm">工具</a><a class="tag" taget="_blank" href="/search/http/1.htm">http</a><a class="tag" taget="_blank" href="/search/p2p/1.htm">p2p</a><a class="tag" taget="_blank" href="/search/tcp%2Fip/1.htm">tcp/ip</a>
                        <div>蓦然回首，发现中年的自己，假期的日常主要就是休息遛娃游玩，好久没有写一写博客了。自己近1年有一些自己闲暇的时间的时候，其实也在折腾一些事情。gohls折腾的事情，主要是娱乐好玩工具性的一些东西，比如抄了一下gohls这个项目GitHub-shimberger/gohls:Aserverthatexposesadirectoryforvideostreamingviawebinterface，在家里</div>
                    </li>
                    <li><a href="/article/1772425208259477504.htm"
                           title="webpack快速基础" target="_blank">webpack快速基础</a>
                        <span class="text-muted">风漫漫雨歇歇</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>文章目录webpack快速基础1.概念1.1入口1.2输出(output)1.3loader1.4插件（plugin)2.建立项目，用于测试功能2.1安装webpack，2.2创建webpack配置文件,2.3配置package.json，运行项目3.配置mode开发环境4.配置entry编译入口5.配置output编译出口6.配置加载csswebpack快速基础1.概念webpack是现代Jav</div>
                    </li>
                    <li><a href="/article/1772414383096397824.htm"
                           title="Webpack打包" target="_blank">Webpack打包</a>
                        <span class="text-muted">爱敲代码小黑</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a>
                        <div>Webpack打包目录Webpack打包打包图片资源模块类型（**assetmoduletype**）url-loader的limit效果打包图片我们当前使用的webpack版本是webpack5：在webpack5之前，加载这些资源我们需要使用一些loader，比如raw-loader、url-loader、file-loader；在webpack5开始，我们可以直接使用资源模块类型（ass</div>
                    </li>
                    <li><a href="/article/1772407208080900096.htm"
                           title="网络安全（黑客）—2024自学笔记" target="_blank">网络安全（黑客）—2024自学笔记</a>
                        <span class="text-muted">羊村最强沸羊羊</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>前言一、什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。二、怎样规划网络安全如果你</div>
                    </li>
                                <li><a href="/article/94.htm"
                                       title="PHP，安卓，UI，java，linux视频教程合集" target="_blank">PHP，安卓，UI，java，linux视频教程合集</a>
                                    <span class="text-muted">cocos2d-x小菜</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/UI/1.htm">UI</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a>
                                    <div>╔-----------------------------------╗┆                           </div>
                                </li>
                                <li><a href="/article/221.htm"
                                       title="各表中的列名必须唯一。在表 'dbo.XXX' 中多次指定了列名 'XXX'。" target="_blank">各表中的列名必须唯一。在表 'dbo.XXX' 中多次指定了列名 'XXX'。</a>
                                    <span class="text-muted">bozch</span>
<a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a><a class="tag" taget="_blank" href="/search/.net+mvc/1.htm">.net mvc</a>
                                    <div>在.net mvc5中，在执行某一操作的时候，出现了如下错误： 
      各表中的列名必须唯一。在表 'dbo.XXX' 中多次指定了列名 'XXX'。 
经查询当前的操作与错误内容无关，经过对错误信息的排查发现，事故出现在数据库迁移上。 
回想过去： 在迁移之前已经对数据库进行了添加字段操作，再次进行迁移插入XXX字段的时候，就会提示如上错误。  
&</div>
                                </li>
                                <li><a href="/article/348.htm"
                                       title="Java 对象大小的计算" target="_blank">Java 对象大小的计算</a>
                                    <span class="text-muted">e200702084</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                                    <div>                          Java对象的大小 
 
如何计算一个对象的大小呢？ 
 
 
   </div>
                                </li>
                                <li><a href="/article/475.htm"
                                       title="Mybatis Spring" target="_blank">Mybatis Spring</a>
                                    <span class="text-muted">171815164</span>
<a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a>
                                    <div>ApplicationContext ac = new ClassPathXmlApplicationContext("applicationContext.xml");
CustomerService userService = (CustomerService) ac.getBean("customerService");
Customer cust</div>
                                </li>
                                <li><a href="/article/602.htm"
                                       title="JVM 不稳定参数" target="_blank">JVM 不稳定参数</a>
                                    <span class="text-muted">g21121</span>
<a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a>
                                    <div>        -XX 参数被称为不稳定参数，之所以这么叫是因为此类参数的设置很容易引起JVM 性能上的差异，使JVM 存在极大的不稳定性。当然这是在非合理设置的前提下，如果此类参数设置合理讲大大提高JVM 的性能及稳定性。        可以说“不稳定参数”</div>
                                </li>
                                <li><a href="/article/729.htm"
                                       title="用户自动登录网站" target="_blank">用户自动登录网站</a>
                                    <span class="text-muted">永夜-极光</span>
<a class="tag" taget="_blank" href="/search/%E7%94%A8%E6%88%B7/1.htm">用户</a>
                                    <div>1.目标:实现用户登录后,再次登录就自动登录,无需用户名和密码 
2.思路:将用户的信息保存为cookie 
           每次用户访问网站,通过filter拦截所有请求,在filter中读取所有的cookie,如果找到了保存登录信息的cookie,那么在cookie中读取登录信息,然后直接</div>
                                </li>
                                <li><a href="/article/856.htm"
                                       title="centos7 安装后失去win7的引导记录" target="_blank">centos7 安装后失去win7的引导记录</a>
                                    <span class="text-muted">程序员是怎么炼成的</span>
<a class="tag" taget="_blank" href="/search/%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F/1.htm">操作系统</a>
                                    <div>1.使用root身份(必须)打开 /boot/grub2/grub.cfg 2.找到 ### BEGIN /etc/grub.d/30_os-prober ###   在后面添加    menuentry "Windows 7 (loader) (on /dev/sda1)" { </div>
                                </li>
                                <li><a href="/article/983.htm"
                                       title="Oracle 10g 官方中文安装帮助文档以及Oracle官方中文教程文档下载" target="_blank">Oracle 10g 官方中文安装帮助文档以及Oracle官方中文教程文档下载</a>
                                    <span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
                                    <div>Oracle 10g 官方中文安装帮助文档下载：http://download.csdn.net/tag/Oracle%E4%B8%AD%E6%96%87API%EF%BC%8COracle%E4%B8%AD%E6%96%87%E6%96%87%E6%A1%A3%EF%BC%8Coracle%E5%AD%A6%E4%B9%A0%E6%96%87%E6%A1%A3 Oracle 10g 官方中文教程</div>
                                </li>
                                <li><a href="/article/1110.htm"
                                       title="JavaEE开源快速开发平台G4Studio_V3.2发布了" target="_blank">JavaEE开源快速开发平台G4Studio_V3.2发布了</a>
                                    <span class="text-muted">無為子</span>
<a class="tag" taget="_blank" href="/search/AOP/1.htm">AOP</a><a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/javaee/1.htm">javaee</a><a class="tag" taget="_blank" href="/search/G4Studio/1.htm">G4Studio</a>
                                    <div>  
我非常高兴地宣布,今天我们最新的JavaEE开源快速开发平台G4Studio_V3.2版本已经正式发布。大家可以通过如下地址下载。 
  
访问G4Studio网站  
http://www.g4it.org      
G4Studio_V3.2版本变更日志 
功能新增 
(1).新增了系统右下角滑出提示窗口功能。 
(2).新增了文件资源的Zip压缩和解压缩</div>
                                </li>
                                <li><a href="/article/1237.htm"
                                       title="Oracle常用的单行函数应用技巧总结" target="_blank">Oracle常用的单行函数应用技巧总结</a>
                                    <span class="text-muted">百合不是茶</span>
<a class="tag" taget="_blank" href="/search/%E6%97%A5%E6%9C%9F%E5%87%BD%E6%95%B0/1.htm">日期函数</a><a class="tag" taget="_blank" href="/search/%E8%BD%AC%E6%8D%A2%E5%87%BD%E6%95%B0%28%E6%A0%B8%E5%BF%83%29/1.htm">转换函数(核心)</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E5%AD%97%E5%87%BD%E6%95%B0/1.htm">数字函数</a><a class="tag" taget="_blank" href="/search/%E9%80%9A%E7%94%A8%E5%87%BD%E6%95%B0%28%E6%A0%B8%E5%BF%83%29/1.htm">通用函数(核心)</a><a class="tag" taget="_blank" href="/search/%E5%AD%97%E7%AC%A6%E5%87%BD%E6%95%B0/1.htm">字符函数</a>
                                    <div>单行函数;   字符函数,数字函数,日期函数,转换函数(核心),通用函数(核心) 
一:字符函数: 
   .UPPER(字符串) 将字符串转为大写
   .LOWER (字符串) 将字符串转为小写 
   .INITCAP(字符串) 将首字母大写
   .LENGTH (字符串) 字符串的长度
   .REPLACE(字符串,'A','_') 将字符串字符A转换成_
</div>
                                </li>
                                <li><a href="/article/1364.htm"
                                       title="Mockito异常测试实例" target="_blank">Mockito异常测试实例</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95/1.htm">单元测试</a><a class="tag" taget="_blank" href="/search/mockito/1.htm">mockito</a>
                                    <div>Mockito异常测试实例： 
package com.bijian.study;

import static org.mockito.Mockito.mock;
import static org.mockito.Mockito.when;

import org.junit.Assert;
import org.junit.Test;

import org.mockito.</div>
                                </li>
                                <li><a href="/article/1491.htm"
                                       title="GA与量子恒道统计" target="_blank">GA与量子恒道统计</a>
                                    <span class="text-muted">Bill_chen</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a><a class="tag" taget="_blank" href="/search/%E7%99%BE%E5%BA%A6/1.htm">百度</a><a class="tag" taget="_blank" href="/search/Google/1.htm">Google</a><a class="tag" taget="_blank" href="/search/%E9%98%B2%E7%81%AB%E5%A2%99/1.htm">防火墙</a>
                                    <div>前一阵子，统计**网址时，Google Analytics（GA） 和量子恒道统计（也称量子统计），数据有较大的偏差，仔细找相关资料研究了下，总结如下： 
  
为何GA和量子网站统计（量子统计前身为雅虎统计）结果不同？ 
首先：没有一种网站统计工具能保证百分之百的准确出现该问题可能有以下几个原因：（1）不同的统计分析系统的算法机制不同；（2）统计代码放置的位置和前后</div>
                                </li>
                                <li><a href="/article/1618.htm"
                                       title="【Linux命令三】Top命令" target="_blank">【Linux命令三】Top命令</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/linux%E5%91%BD%E4%BB%A4/1.htm">linux命令</a>
                                    <div>Linux的Top命令类似于Windows的任务管理器，可以查看当前系统的运行情况，包括CPU、内存的使用情况等。如下是一个Top命令的执行结果： 
  
  
top - 21:22:04 up 1 day, 23:49, 1 user, load average: 1.10, 1.66, 1.99
Tasks: 202 total,   4 running, 198 sl</div>
                                </li>
                                <li><a href="/article/1745.htm"
                                       title="spring四种依赖注入方式" target="_blank">spring四种依赖注入方式</a>
                                    <span class="text-muted">白糖_</span>
<a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a>
                                    <div>   平常的java开发中，程序员在某个类中需要依赖其它类的方法，则通常是new一个依赖类再调用类实例的方法，这种开发存在的问题是new的类实例不好统一管理，spring提出了依赖注入的思想，即依赖类不由程序员实例化，而是通过spring容器帮我们new指定实例并且将实例注入到需要该对象的类中。依赖注入的另一种说法是“控制反转”，通俗的理解是：平常我们new一个实例，这个实例的控制权是我</div>
                                </li>
                                <li><a href="/article/1872.htm"
                                       title="angular.injector" target="_blank">angular.injector</a>
                                    <span class="text-muted">boyitech</span>
<a class="tag" taget="_blank" href="/search/AngularJS/1.htm">AngularJS</a><a class="tag" taget="_blank" href="/search/AngularJS+API/1.htm">AngularJS API</a>
                                    <div>angular.injector 
   描述:   创建一个injector对象, 调用injector对象的方法可以获得angular的service, 或者用来做依赖注入.        使用方法:   angular.injector(modules, [strictDi])        参数详解:      Param Type Details   mod</div>
                                </li>
                                <li><a href="/article/1999.htm"
                                       title="java-同步访问一个数组Integer[10]，生产者不断地往数组放入整数1000，数组满时等待；消费者不断地将数组里面的数置零，数组空时等待" target="_blank">java-同步访问一个数组Integer[10]，生产者不断地往数组放入整数1000，数组满时等待；消费者不断地将数组里面的数置零，数组空时等待</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/Integer/1.htm">Integer</a>
                                    <div>

public class PC {

	/**
	 * 题目：生产者-消费者。
	 * 同步访问一个数组Integer[10]，生产者不断地往数组放入整数1000，数组满时等待；消费者不断地将数组里面的数置零，数组空时等待。
	 */
	
	private static final Integer[] val=new Integer[10];
	private static</div>
                                </li>
                                <li><a href="/article/2126.htm"
                                       title="使用Struts2.2.1配置" target="_blank">使用Struts2.2.1配置</a>
                                    <span class="text-muted">Chen.H</span>
<a class="tag" taget="_blank" href="/search/apache/1.htm">apache</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/struts/1.htm">struts</a>
                                    <div>Struts2.2.1 需要如下 jar包: commons-fileupload-1.2.1.jar commons-io-1.3.2.jar commons-logging-1.0.4.jar freemarker-2.3.16.jar javassist-3.7.ga.jar ognl-3.0.jar spring.jar 
struts2-core-2.2.1.jar struts2-sp</div>
                                </li>
                                <li><a href="/article/2253.htm"
                                       title="[职业与教育]青春之歌" target="_blank">[职业与教育]青春之歌</a>
                                    <span class="text-muted">comsci</span>
<a class="tag" taget="_blank" href="/search/%E6%95%99%E8%82%B2/1.htm">教育</a>
                                    <div> 
 
       每个人都有自己的青春之歌............但是我要说的却不是青春... 
 
       大家如果在自己的职业生涯没有给自己以后创业留一点点机会,仅仅凭学历和人脉关系,是难以在竞争激烈的市场中生存下去的.... 
 
  &nbs</div>
                                </li>
                                <li><a href="/article/2380.htm"
                                       title="oracle连接(join)中使用using关键字" target="_blank">oracle连接(join)中使用using关键字</a>
                                    <span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/JOIN/1.htm">JOIN</a><a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/using/1.htm">using</a>
                                    <div>在oracle连接(join)中使用using关键字 
34. View the Exhibit and examine the structure of the ORDERS and ORDER_ITEMS tables. 
Evaluate the following SQL statement: 
SELECT oi.order_id, product_id, order_date 
FRO</div>
                                </li>
                                <li><a href="/article/2507.htm"
                                       title="NIO示例" target="_blank">NIO示例</a>
                                    <span class="text-muted">daysinsun</span>
<a class="tag" taget="_blank" href="/search/nio/1.htm">nio</a>
                                    <div>NIO服务端代码： 
 

public class NIOServer {
	
	private Selector selector;

	
	public void startServer(int port) throws IOException {

		ServerSocketChannel serverChannel = ServerSocketChannel.open(</div>
                                </li>
                                <li><a href="/article/2634.htm"
                                       title="C语言学习homework1" target="_blank">C语言学习homework1</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/homework/1.htm">homework</a>
                                    <div>0、 课堂练习做完 
1、使用sizeof计算出你所知道的所有的类型占用的空间。 
int x; 
sizeof(x); 
  
sizeof(int); 
  
# include <stdio.h>

int main(void)
{
	int x1;
	char x2;
	double x3;
	float x4;

	printf(&quo</div>
                                </li>
                                <li><a href="/article/2761.htm"
                                       title="select in order by , mysql排序" target="_blank">select in order by , mysql排序</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a>
                                    <div>If i select like this: 
SELECT id FROM users WHERE id IN(3,4,8,1); 
This by default will select users in this order 
1,3,4,8, 
I would like to select them in the same order that i put IN() values so: </div>
                                </li>
                                <li><a href="/article/2888.htm"
                                       title="页面校验-新建项目" target="_blank">页面校验-新建项目</a>
                                    <span class="text-muted">fanxiaolong</span>
<a class="tag" taget="_blank" href="/search/%E9%A1%B5%E9%9D%A2%E6%A0%A1%E9%AA%8C/1.htm">页面校验</a>
                                    <div>$(document).ready(
	function() {
			var flag = true;
		$('#changeform').submit(function() {
			var projectScValNull = true;
			var s ="";
			var parent_id = $("#parent_id").v</div>
                                </li>
                                <li><a href="/article/3015.htm"
                                       title="Ehcache（02）——ehcache.xml简介" target="_blank">Ehcache（02）——ehcache.xml简介</a>
                                    <span class="text-muted">234390216</span>
<a class="tag" taget="_blank" href="/search/ehcache/1.htm">ehcache</a><a class="tag" taget="_blank" href="/search/ehcache.xml/1.htm">ehcache.xml</a><a class="tag" taget="_blank" href="/search/%E7%AE%80%E4%BB%8B/1.htm">简介</a>
                                    <div>ehcache.xml简介 
  
       ehcache.xml文件是用来定义Ehcache的配置信息的，更准确的来说它是定义CacheManager的配置信息的。根据之前我们在《Ehcache简介》一文中对CacheManager的介绍我们知道一切Ehcache的应用都是从CacheManager开始的。在不指定配置信</div>
                                </li>
                                <li><a href="/article/3142.htm"
                                       title="junit 4.11中三个新功能" target="_blank">junit 4.11中三个新功能</a>
                                    <span class="text-muted">jackyrong</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                                    <div>junit 4.11中两个新增的功能，首先是注解中可以参数化，比如 
 
 


import static org.junit.Assert.assertEquals;
 
import java.util.Arrays;
 
import org.junit.Test;
import org.junit.runner.RunWith;
import org.junit.runn</div>
                                </li>
                                <li><a href="/article/3269.htm"
                                       title="国外程序员爱用苹果Mac电脑的10大理由" target="_blank">国外程序员爱用苹果Mac电脑的10大理由</a>
                                    <span class="text-muted">php教程分享</span>
<a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/unix/1.htm">unix</a><a class="tag" taget="_blank" href="/search/Microsoft/1.htm">Microsoft</a><a class="tag" taget="_blank" href="/search/perl/1.htm">perl</a>
                                    <div>Mac 在国外很受欢迎，尤其是在 设计/web开发/IT 人员圈子里。普通用户喜欢 Mac 可以理解，毕竟 Mac 设计美观，简单好用，没有病毒。那么为什么专业人士也对 Mac 情有独钟呢？从个人使用经验来看我想有下面几个原因： 
1、Mac OS X 是基于 Unix 的 
这一点太重要了，尤其是对开发人员，至少对于我来说很重要，这意味着Unix 下一堆好用的工具都可以随手捡到。如果你是个 wi</div>
                                </li>
                                <li><a href="/article/3396.htm"
                                       title="位运算、异或的实际应用" target="_blank">位运算、异或的实际应用</a>
                                    <span class="text-muted">wenjinglian</span>
<a class="tag" taget="_blank" href="/search/%E4%BD%8D%E8%BF%90%E7%AE%97/1.htm">位运算</a>
                                    <div>一． 位操作基础，用一张表描述位操作符的应用规则并详细解释。 
      二． 常用位操作小技巧，有判断奇偶、交换两数、变换符号、求绝对值。 
      三． 位操作与空间压缩，针对筛素数进行空间压缩。 
   &n</div>
                                </li>
                                <li><a href="/article/3523.htm"
                                       title="weblogic部署项目出现的一些问题（持续补充中……）" target="_blank">weblogic部署项目出现的一些问题（持续补充中……）</a>
                                    <span class="text-muted">Everyday都不同</span>
<a class="tag" taget="_blank" href="/search/weblogic%E9%83%A8%E7%BD%B2%E5%A4%B1%E8%B4%A5/1.htm">weblogic部署失败</a>
                                    <div>好吧，weblogic的问题确实…… 
  
问题一： 
org.springframework.beans.factory.BeanDefinitionStoreException: Failed to read candidate component class: URL [zip:E:/weblogic/user_projects/domains/base_domain/serve</div>
                                </li>
                                <li><a href="/article/3650.htm"
                                       title="tomcat7性能调优（01）" target="_blank">tomcat7性能调优（01）</a>
                                    <span class="text-muted">toknowme</span>
<a class="tag" taget="_blank" href="/search/tomcat7/1.htm">tomcat7</a>
                                    <div>  
    
Tomcat优化：   1、最大连接数最大线程等设置    
<Connector port="8082" protocol="HTTP/1.1" 
               useBodyEncodingForURI="t</div>
                                </li>
                                <li><a href="/article/3777.htm"
                                       title="PO VO DAO DTO BO TO概念与区别" target="_blank">PO VO DAO DTO BO TO概念与区别</a>
                                    <span class="text-muted">xp9802</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/bean/1.htm">bean</a><a class="tag" taget="_blank" href="/search/%E9%A2%86%E5%9F%9F%E6%A8%A1%E5%9E%8B/1.htm">领域模型</a>
                                    <div>O/R Mapping 是 Object Relational Mapping（对象关系映射）的缩写。通俗点讲，就是将对象与关系数据库绑定，用对象来表示关系数据。在O/R Mapping的世界里，有两个基本的也是重要的东东需要了解，即VO，PO。 
它们的关系应该是相互独立的，一个VO可以只是PO的部分，也可以是多个PO构成，同样也可以等同于一个PO（指的是他们的属性）。这样，PO独立出来，数据持</div>
                                </li>
                </ul>
            </div>
        </div>
    </div>

<div>
    <div class="container">
        <div class="indexes">
            <strong>按字母分类：</strong>
            <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a
                href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a
                href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a
                href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a
                href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a
                href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a
                href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a
                href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a
                href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a>
        </div>
    </div>
</div>
<footer id="footer" class="mb30 mt30">
    <div class="container">
        <div class="footBglm">
            <a target="_blank" href="/">首页</a> -
            <a target="_blank" href="/custom/about.htm">关于我们</a> -
            <a target="_blank" href="/search/Java/1.htm">站内搜索</a> -
            <a target="_blank" href="/sitemap.txt">Sitemap</a> -
            <a target="_blank" href="/custom/delete.htm">侵权投诉</a>
        </div>
        <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.
<!--            <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>-->
        </div>
    </div>
</footer>
<!-- 代码高亮 -->
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/>
<script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script>





</body>

</html>