diff --git "a/19\351\231\210\345\277\227\346\242\201/\344\275\234\344\270\232/2022-10-21\344\275\234\344\270\232JQuery.md" "b/19\351\231\210\345\277\227\346\242\201/\344\275\234\344\270\232/2022-10-21\344\275\234\344\270\232JQuery.md"
new file mode 100644
index 0000000000000000000000000000000000000000..9b1a9eb777ea9e669d3337a5a4eb6882ac0bcd06
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\344\275\234\344\270\232/2022-10-21\344\275\234\344\270\232JQuery.md"
@@ -0,0 +1,90 @@
+# JQuery
+
+主要包括： 1. 代码简洁 2. 完美兼容 3. 轻量级 4. 强大的选择器 5. 完善的AJAX 6. 丰富的插件 “简洁与高效”是jQuery最大的特点。
+
+#### JQuery安装
+
+ jQuery文件，说白了就是一个“外部JavaScript文件”。所谓的安装jQuery，其实就是把这个外部 JavaScript文件引入后，就可以使用jQuery语法了。 对于1.x版本来说，现在最新版本是jquery-1.12.4.min.js。
+
+语法：
+
+```
+<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+<script>
+//你的jQuery代码
+</script>
+```
+
+说明： 我们必须先把jQuery库文件引入，才能够使用jQuery语法。也就是说，你写的jQuery代码必须放在 jQuery库文件下面才能生效。
+
+```
+<script>
+//你的jQuery代码
+</script>
+<script src="jquery-1.12.4.min.js"></script>
+```
+
+#### JQuery对象
+
+##### JQuery核心:
+
+```
+$符号在JQuery中代表对JQuery对象的引用.
+ $ <===> JQuery
+```
+
+**DOM对象**:通过js代码获取到的对象都是DOM对象，原始的DOM对象只有DOM接口提供的方法和属性；
+
+```
+var div = document.getElementById('testDiv');
+var divs = document.getElementsByTagName('div')
+```
+
+**JQuery包装集对象**:简称JQuery对象，通过JQuery框架获取的对象，注意：只有JQuery对象才能使用JQuery提供的方法。
+
+JQuery可以说是DOM对象的补充，JQuery规定：无论是一个还是一组，都封装成一个JQuery包装集，比如获取包含一个元素的JQuery包装集。
+
+```
+var jqObj = $('#testDiv');
+```
+
+#### JQuery选择器
+
+##### 基础选择器
+
+| 选择器名称           | 用法（例子演示） | 描述                                                         |
+| -------------------- | ---------------- | ------------------------------------------------------------ |
+| id选择器             | $(“#id”)         | 获取指定的id的元素                                           |
+| 类选择器             | $(“.class”)      | 获取指定的class的元素                                        |
+| 标签选择器           | $(“标签”)        | 获取指定的标签的元素                                         |
+| 全选选择器           | $("*)            | 获取所有的元素                                               |
+| 通过this获得html标签 | $(this)          | 获取当前的html元素                                           |
+| 属性选择器           | $(“[href]”)      | 选取带有 href 属性的元素。还可以如此用 ( " a [ t a r g e t = b ′ l a n k ′ ] " ) : 选取所有 t a r g e t 属性值等于 " b l a n k " 的 < a > 元素 < b r > ("a[target='_blank']") : 选取所有 target 属性值等于 "_blank" 的 元素 ("a[target=b′lank′]"):选取所有target属性值等于"blank"的元素 (“a[target!=‘_blank’]”) : 选取所有 target 属性值不等于 “_blank” 的 元素 |
+| 并集选择器           | $(“div,p,li”)    | 获得div p li 的元素标签集合                                  |
+| 并集选择器           | $(“p.intro”)     | 选取 class 为 intro 的元素                                   |
+
+##### 伪元素或伪标签选择器
+
+当然可以使用伪属性或者伪标签。
+
+| 伪元素或伪属性 | 语法                     | 描述                                                     |
+| -------------- | ------------------------ | -------------------------------------------------------- |
+| :first         | $(“p:first”)             | 选取第一个元素                                           |
+| :last          | $(“p:last”)              | 选取最后一个元素                                         |
+| :not(selector) | $(“input:not(:checked)”) | 选取input 不带有checked属性的元素                        |
+| :even          | $(“tr:even”)             | 选取偶数位置的                                           |
+| :odd           | $(“tr:odd”)              | 选取奇数位置的                                           |
+| :eq(index)     | $(“tr:eq(1)”)            | 匹配一个给定索引值的元素,选取t标签第二个元素 （从0开始） |
+| :gt(index)     | $(“tr:gt(0)”)            | 选取t标签第一个元素后面的元素 （从0开始，所以大于0）     |
+|                | $(“:button”)             | 选取所有 type=“button” 的 元素 和 元素                   |
+
+##### 层级选择器
+
+当然还可以使用层级选择器：
+
+| 选择器名字 | 用法（例子） | 描述                                                         |
+| ---------- | ------------ | ------------------------------------------------------------ |
+| 子代选择器 | $(“div >p”)  | 使用>获得子级的元素， 不会获得孙子级以及更内层的元素，例子：获取div标签内嵌的第一层标签为p的元素 |
+| 后代选择器 | $(“div p”)   | 使用空格，是后代选择器就是获得div中无论内嵌的任何层p元素     |
+| 紧邻选择器 | $(“#id +p”)  | 使用+号， 匹配所有 紧接在 id为di 元素后的 p 元素。（好好理解这句话，不是所id后面所有的p标签哦，而复合id后面紧邻p的所有o标签） |
+| 兄弟选择器 | $(“#id ~ p”) | 使用~号，匹配 id为id 元素之后的所有 p 元素。                 |
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-17\347\254\224\350\256\260\344\272\213\344\273\266.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-17\347\254\224\350\256\260\344\272\213\344\273\266\345\217\226\346\266\210.md"
similarity index 100%
rename from "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-17\347\254\224\350\256\260\344\272\213\344\273\266.md"
rename to "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-17\347\254\224\350\256\260\344\272\213\344\273\266\345\217\226\346\266\210.md"
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-21\344\275\234\344\270\232JQuery.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-21\344\275\234\344\270\232JQuery.md"
new file mode 100644
index 0000000000000000000000000000000000000000..9b1a9eb777ea9e669d3337a5a4eb6882ac0bcd06
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-21\344\275\234\344\270\232JQuery.md"
@@ -0,0 +1,90 @@
+# JQuery
+
+主要包括： 1. 代码简洁 2. 完美兼容 3. 轻量级 4. 强大的选择器 5. 完善的AJAX 6. 丰富的插件 “简洁与高效”是jQuery最大的特点。
+
+#### JQuery安装
+
+ jQuery文件，说白了就是一个“外部JavaScript文件”。所谓的安装jQuery，其实就是把这个外部 JavaScript文件引入后，就可以使用jQuery语法了。 对于1.x版本来说，现在最新版本是jquery-1.12.4.min.js。
+
+语法：
+
+```
+<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+<script>
+//你的jQuery代码
+</script>
+```
+
+说明： 我们必须先把jQuery库文件引入，才能够使用jQuery语法。也就是说，你写的jQuery代码必须放在 jQuery库文件下面才能生效。
+
+```
+<script>
+//你的jQuery代码
+</script>
+<script src="jquery-1.12.4.min.js"></script>
+```
+
+#### JQuery对象
+
+##### JQuery核心:
+
+```
+$符号在JQuery中代表对JQuery对象的引用.
+ $ <===> JQuery
+```
+
+**DOM对象**:通过js代码获取到的对象都是DOM对象，原始的DOM对象只有DOM接口提供的方法和属性；
+
+```
+var div = document.getElementById('testDiv');
+var divs = document.getElementsByTagName('div')
+```
+
+**JQuery包装集对象**:简称JQuery对象，通过JQuery框架获取的对象，注意：只有JQuery对象才能使用JQuery提供的方法。
+
+JQuery可以说是DOM对象的补充，JQuery规定：无论是一个还是一组，都封装成一个JQuery包装集，比如获取包含一个元素的JQuery包装集。
+
+```
+var jqObj = $('#testDiv');
+```
+
+#### JQuery选择器
+
+##### 基础选择器
+
+| 选择器名称           | 用法（例子演示） | 描述                                                         |
+| -------------------- | ---------------- | ------------------------------------------------------------ |
+| id选择器             | $(“#id”)         | 获取指定的id的元素                                           |
+| 类选择器             | $(“.class”)      | 获取指定的class的元素                                        |
+| 标签选择器           | $(“标签”)        | 获取指定的标签的元素                                         |
+| 全选选择器           | $("*)            | 获取所有的元素                                               |
+| 通过this获得html标签 | $(this)          | 获取当前的html元素                                           |
+| 属性选择器           | $(“[href]”)      | 选取带有 href 属性的元素。还可以如此用 ( " a [ t a r g e t = b ′ l a n k ′ ] " ) : 选取所有 t a r g e t 属性值等于 " b l a n k " 的 < a > 元素 < b r > ("a[target='_blank']") : 选取所有 target 属性值等于 "_blank" 的 元素 ("a[target=b′lank′]"):选取所有target属性值等于"blank"的元素 (“a[target!=‘_blank’]”) : 选取所有 target 属性值不等于 “_blank” 的 元素 |
+| 并集选择器           | $(“div,p,li”)    | 获得div p li 的元素标签集合                                  |
+| 并集选择器           | $(“p.intro”)     | 选取 class 为 intro 的元素                                   |
+
+##### 伪元素或伪标签选择器
+
+当然可以使用伪属性或者伪标签。
+
+| 伪元素或伪属性 | 语法                     | 描述                                                     |
+| -------------- | ------------------------ | -------------------------------------------------------- |
+| :first         | $(“p:first”)             | 选取第一个元素                                           |
+| :last          | $(“p:last”)              | 选取最后一个元素                                         |
+| :not(selector) | $(“input:not(:checked)”) | 选取input 不带有checked属性的元素                        |
+| :even          | $(“tr:even”)             | 选取偶数位置的                                           |
+| :odd           | $(“tr:odd”)              | 选取奇数位置的                                           |
+| :eq(index)     | $(“tr:eq(1)”)            | 匹配一个给定索引值的元素,选取t标签第二个元素 （从0开始） |
+| :gt(index)     | $(“tr:gt(0)”)            | 选取t标签第一个元素后面的元素 （从0开始，所以大于0）     |
+|                | $(“:button”)             | 选取所有 type=“button” 的 元素 和 元素                   |
+
+##### 层级选择器
+
+当然还可以使用层级选择器：
+
+| 选择器名字 | 用法（例子） | 描述                                                         |
+| ---------- | ------------ | ------------------------------------------------------------ |
+| 子代选择器 | $(“div >p”)  | 使用>获得子级的元素， 不会获得孙子级以及更内层的元素，例子：获取div标签内嵌的第一层标签为p的元素 |
+| 后代选择器 | $(“div p”)   | 使用空格，是后代选择器就是获得div中无论内嵌的任何层p元素     |
+| 紧邻选择器 | $(“#id +p”)  | 使用+号， 匹配所有 紧接在 id为di 元素后的 p 元素。（好好理解这句话，不是所id后面所有的p标签哦，而复合id后面紧邻p的所有o标签） |
+| 兄弟选择器 | $(“#id ~ p”) | 使用~号，匹配 id为id 元素之后的所有 p 元素。                 |
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-22\347\254\224\350\256\260jQuery Dom \346\223\215\344\275\234.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-22\347\254\224\350\256\260jQuery Dom \346\223\215\344\275\234.md"
new file mode 100644
index 0000000000000000000000000000000000000000..46ccbf755bf68229e114fd099c6ccf3dee2ac7b8
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-22\347\254\224\350\256\260jQuery Dom \346\223\215\344\275\234.md"	
@@ -0,0 +1,259 @@
+## jQuery Dom 操作
+
+ jQuery也提供了对HTML节点的操作，而且在原生js的基础之上进行了优化，使用起来更加方便。 常用的从几个方面来操作，查找元素（选择器已经实现）；创建节点对象；访问和设置节点对象的值，以及属性；添加节点；删除节点；删除、添加、修改、设定节点的CSS样式等。**注意：以下的操作方式只适用于jQuery对象。**
+
+#### 1.操作元素的属性
+
+###### 1.1 获取属性
+
+| 方法           | 说明                                                         | 举例                         |
+| -------------- | ------------------------------------------------------------ | ---------------------------- |
+| attr(属性名称) | 获取指定的属性值，操作checkbox时 选中返回checked，没有选中返回undefined。 | attr('checked') attr('name') |
+| prop(属性名称) | 获取具有true和false两个属性的属性值                          | prop('checked')              |
+
+属性的分类：
+
+- 固有属性：
+- 返回值是bool的属性: checked ,selected, disabled
+- 自定义属性
+
+attr与prop在用法上有什么区别？
+
+```
+<!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>Document</title>
+</head>
+<body>
+    <input type="checkbox" name="cb" id="aa" checked="checked">
+    <input type="checkbox" name="cb" id="bb" >
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+</body>
+</html>
+```
+
+###### 1.2 设置属性
+
+```
+attr('属性名','属性值')
+```
+
+###### 1.3 移除属性
+
+```
+removeAttr('属性名')
+```
+
+#### 2. 操作元素的样式
+
+ 对于元素的样式，也是一种属性，由于样式用得特别多，所以对于样式除了当做属性处理外还可以有专门的方法进行处理。
+
+| 方法                   | 说明                        |
+| ---------------------- | --------------------------- |
+| attr('class')          | 获取属性的值，即样式名称    |
+| attr('class','样式名') | 修改class属性的值，修改样式 |
+| addClass('样式名')     | 添加样式名称                |
+| css()                  | 添加具体的样式              |
+| removeClass(class)     | 移除样式名称                |
+
+其中，css()表示增加具体样式：
+
+```
+1) css('样式名','样式值')
+  例: css('color','red')
+
+2) css({'样式名':'样式值','样式名2':'样式值2'})
+  例: css({'background-color':'red','color':'red'})
+<!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>Document</title>
+    <style type="text/css">
+        div{
+            padding:10px;
+            width: 200px;
+        }
+        .blue{
+            background: blue;
+        }
+        .larger{
+            font-size: 30px;
+        }
+        .green{
+            background: green;
+        }
+    </style>
+</head>
+<body>
+    <div id="conBlue" class="blue larger">背景天蓝色</div>
+    <div id="conRed">红色</div>
+    <div id="remove" class="blue larger">背景天蓝色</div>
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+</body>
+</html>
+```
+
+#### 3. 操作元素内容
+
+| 方法              | 说明                               |
+| ----------------- | ---------------------------------- |
+| html()            | 获取元素的html内容                 |
+| html('html,内容') | 设定元素的内容                     |
+| text()            | 获取元素的内容，不识别html标签     |
+| text('text 内容') | 设置元素的文本内容，不识别html标签 |
+| val()             | 获取元素的值（表单元素）           |
+| val('值')         | 设定元素的值                       |
+
+常见的表单元素(可以操作的):文本框，密码框，单选框，复选框，隐藏域，文本域，下拉框
+
+非表单元素:div,span,h1~h6,table,tr,td,li,p等
+
+```
+<!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>Document</title>
+</head>
+
+<body>
+    <div id="html">龙岩</div>
+    <div id="text">龙岩</div>
+    <input type="text" name="uname" id="op" value="oop" />
+</body>
+<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+
+</html>
+```
+
+#### 4. 创建元素
+
+ 在jQuery创建元素很简单，直接使用核心函数即可
+
+```
+$('元素内容');
+$('<p>this is a paragraph!!!</p>')
+```
+
+#### 5. 添加元素
+
+| 方法                           | 说明                                                         |
+| ------------------------------ | ------------------------------------------------------------ |
+| prepend(content)               | 在被选元素内部的开头插入元素或内容，被追加的content参数，可以是字符，HTML元素标记。 |
+| $(content).prependTo(selector) | 把content元素或内容加入selector元素开头                      |
+| append(content)                | 在被选元素内部的结尾插入元素或内容， 被追加的content参数，可以是字符，HTML元素标记。 |
+| $(content).appendTo(selector)  | 把content元素或内容插入slector元素内，默认是在尾部           |
+| before()                       | 在元素前插入指定的元素或内容: $(selector).before(content)    |
+| after()                        | 在元素后插入指定的元素或内容: $(selector).after(content)     |
+
+```
+<!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>Document</title>
+</head>
+    <style>
+        div{
+            margin:10px 0px;
+        }
+        span{
+            color:white;
+            padding: 8px;
+        }
+        .red{
+            background-color: red;
+        }
+        .blue{
+            background-color: blue;
+        }
+        .green{
+            background-color: green;
+        }
+    </style>
+<body>
+    <h3>prepend()方法前追加内容</h3>
+    <h3>prependTo()方法前追加内容</h3>
+    <h3>append()方法后追加内容</h3>
+    <h3>appendTo()方法后追加内容</h3>
+    <span class='red'>靓仔</span>
+    <span class='blue'>靓女</span>
+    <div class="green">
+        <span>小鲜肉</span>
+    </div>
+</body>
+<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+
+</html>
+```
+
+#### 6. 删除元素
+
+| 方法     | 说明                                                 |
+| -------- | ---------------------------------------------------- |
+| remove() | 删除所选元素或指定的子元素，包括整个标签和内容一起删 |
+| empty()  | 清除所选元素的内容                                   |
+
+```
+<!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>Document</title>
+</head>
+    <style>
+        span{
+            color:white;
+            padding: 8px;
+            margin:5px;
+            float:left;
+        }
+        .red{
+            background-color: red;
+        }
+        .blue{
+            background-color: blue;
+        }
+        .green{
+            background-color: green;
+        }
+    </style>
+<body>
+    <h3>删除元素</h3>
+    <span class="blue">jquery</span>
+    <span class="green">javascript</span>
+    <span class="blue">linux</span>
+    <span class="green">java</span>
+</body>
+<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+
+</html>
+```
+
+#### 7. 遍历元素
+
+each()
+
+$(selector).each(function(index,element)):遍历元素
+
+参数function为遍历时的回调函数
+
+index 为遍历元素的序列号，从0开始
+
+element为当前的元素(===this)，此时是dom元素
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-23\347\254\224\350\256\260jQuery\344\272\213\344\273\266.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-23\347\254\224\350\256\260jQuery\344\272\213\344\273\266.md"
new file mode 100644
index 0000000000000000000000000000000000000000..93c4a5472e6cb90313a90a301ddfce723800003c
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-23\347\254\224\350\256\260jQuery\344\272\213\344\273\266.md"
@@ -0,0 +1,39 @@
+# jQuery事件
+
+在文档加载后激活函数(常用写法)
+
+```
+$(function(){
+  $('#txt').keyup(
+         function () {
+             $('#num').text($('#txt').val().length);
+         }
+     )
+});
+```
+
+### 常用事件
+
+**click()**：鼠标单击
+
+**contextmenu()**:右键单击菜单（右键菜单按钮时间，可以拒绝右键菜单。）
+
+**dblclick()**:双击触发
+
+**mousedown()**:鼠标按下
+
+**mouseup()**:鼠标松开
+
+**mousemove()**:鼠标移动
+
+**mouseout()**:鼠标移出元素
+
+**mouseover()**:鼠标移入元素
+
+**keydown()**:按下键盘
+
+**keyup()**:按下键盘松开
+
+**focus()**:获得焦点
+
+**blur()**:失去焦点
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-24\347\254\224\350\256\260jQuery.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-24\347\254\224\350\256\260jQuery.md"
new file mode 100644
index 0000000000000000000000000000000000000000..483b25d6fe0b567a28cae28ac63d72ad3c0965c3
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-24\347\254\224\350\256\260jQuery.md"
@@ -0,0 +1,70 @@
+## jQuery
+
+### 绑定
+
+#### 多个事件绑定一个函数
+
+```
+bind('事件类型'，函数)
+```
+
+#### 多个事件绑定多个函数(键值对)
+
+```
+bind({'事件类型': 函数,'事件类型':函数})
+```
+
+#### on绑定(动态元素绑定)
+
+```
+//$(父代选择器)
+var text = $('<input type="text">');
+$(function () {
+        $('td').mousedown(function () {
+            $(this).append(text);
+        })
+    })
+$(function () {
+        $('td').on('blur','#text',function () {
+            text.parent().text(text.val());
+        });
+    })
+```
+
+### 解绑
+
+```
+$(function () {
+        $('td').mousedown(function () {
+            $(this).append(text);
+        }).off()
+		//不带参移除所有事件
+    })
+//带参移除特定事件
+```
+
+### 一次事件(类似立即执行函数)
+
+```
+$(function () {
+        $('td').one(function () {
+			//当前元素只触发一次该事件
+            $(this).append(text);
+        })
+    })
+```
+
+## hover(鼠标移入移出)
+
+```
+$(function () {
+        $('div').hover(
+			function () {
+            	$(this).css('color','red')
+        	}，
+			function () {
+            	$(this).css('color','white')
+        	}
+		)
+    })
+```
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-28\347\254\224\350\256\260jQuery.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-28\347\254\224\350\256\260jQuery.md"
new file mode 100644
index 0000000000000000000000000000000000000000..483b25d6fe0b567a28cae28ac63d72ad3c0965c3
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-28\347\254\224\350\256\260jQuery.md"
@@ -0,0 +1,70 @@
+## jQuery
+
+### 绑定
+
+#### 多个事件绑定一个函数
+
+```
+bind('事件类型'，函数)
+```
+
+#### 多个事件绑定多个函数(键值对)
+
+```
+bind({'事件类型': 函数,'事件类型':函数})
+```
+
+#### on绑定(动态元素绑定)
+
+```
+//$(父代选择器)
+var text = $('<input type="text">');
+$(function () {
+        $('td').mousedown(function () {
+            $(this).append(text);
+        })
+    })
+$(function () {
+        $('td').on('blur','#text',function () {
+            text.parent().text(text.val());
+        });
+    })
+```
+
+### 解绑
+
+```
+$(function () {
+        $('td').mousedown(function () {
+            $(this).append(text);
+        }).off()
+		//不带参移除所有事件
+    })
+//带参移除特定事件
+```
+
+### 一次事件(类似立即执行函数)
+
+```
+$(function () {
+        $('td').one(function () {
+			//当前元素只触发一次该事件
+            $(this).append(text);
+        })
+    })
+```
+
+## hover(鼠标移入移出)
+
+```
+$(function () {
+        $('div').hover(
+			function () {
+            	$(this).css('color','red')
+        	}，
+			function () {
+            	$(this).css('color','white')
+        	}
+		)
+    })
+```
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-29\347\254\224\350\256\260jQueryAJAX.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-29\347\254\224\350\256\260jQueryAJAX.md"
new file mode 100644
index 0000000000000000000000000000000000000000..ce2dd9bf7b993d484f057eb4de62cf65510ebc2a
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-29\347\254\224\350\256\260jQueryAJAX.md"
@@ -0,0 +1,278 @@
+# 1. AJAX
+
+ajax是浏览器提供的一系列[api](https://gitee.com/link?target=https%3A%2F%2Fso.csdn.net%2Fso%2Fsearch%3Fq%3Dapi%26spm%3D1001.2101.3001.7020)，可供javascript调用，实现代码控制请求与相应，实现网络2编程
+
+## 1.1 AJAX 的工作原理
+
+```
+其工作原理基本经过以下几个步骤：
+
+客户端发送请求，请求交给 xhr。
+xhr 把请求提交给服务。
+服务器进行业务处理。
+服务器响应数据交给 xhr 对象。
+xhr 对象接收数据，由 JavaScript 把数据写到页面上。
+AJAX 工作原理
+
+AJAX 的创建步骤
+根据 AJAX 的工作原理，它的创建步骤主要包括：
+
+创建 XMLHttpRequest 对象，即创建一个异步调用对象。
+创建一个新的 HTTP 请求，并指定该 HTTP 请求的方法、URL 及验证信息。
+设置响应 HTTP 请求状态变化的函数。
+发送 HTTP 请求。
+获取异步调用返回的数据。
+使用 JavaScript 和 DOM 实现局部刷新。
+AJAX 的具体使用
+以下是 使用 AJAX 的完整流程。
+
+1. 创建 XMLHttpRequest 对象
+   const request = new XMLHttpRequest();
+2. 创建一个新的 HTTP 请求，并指定该 HTTP 请求的方法、URL 及验证信息
+   创建 HTTP 请求可以使用 XMLHttpReques t对象的 open() 方法,其语法代码如下：
+
+request.open(method, url, async, user, password);
+参数解析：
+
+method 要使用的HTTP方法，比如 "GET"、"POST"、"PUT"、"DELETE" 等。
+url 表示要向其发送请求的 URL 地址。
+async (可选) 一个可选的布尔参数，表示是否异步执行操作，默认为 true。如果值为 false，send() 方法直到收到答复前不会返回。如果 true，已完成事务的通知可供事件监听器使用。如果 multipart 属性为 true 则这个必须为 true，否则将引发异常。
+user (可选 用于认证用途的用户名，默认值为 null。
+password (可选) 用于认证用途的密码，默认值为 null。
+\3. 设置响应 HTTP 请求状态变化的函数和服务端返回信息函数
+创建完 HTTP 请求之后，应该就可以将 HTTP 请求发送给 Web 服务器了。然而，发送 HTTP 请求的目的是为了接收从服务器中返回的数据。从创建 XMLHttpRequest 对象开始，到发送数据、接收数据、XMLHttpRequest 对象一共会经历以下 5 种状态：
+
+未初始化状态。在创建完 XMLHttpRequest 对象时，该对象处于未初始化状态，此时 XMLHttpRequest 对象的 readyState 属性值为 0。
+初始化状态。在创建完 XMLHttpRequest 对象后使用 open() 方法创建了 HTTP 请求时，该对象处于初始化状态。此时 XMLHttpRequest 对象的readyState属性值为 1。
+发送数据状态。在初始化 XMLHttpRequest 对象后，使用 send() 方法发送数据时，该对象处于发送数据状态，此时XMLHttpRequest 对象的 readyState 属性值为 2。
+接收数据状态。Web 服务器接收完数据并进行处理完毕之后，向客户端传送返回的结果。此时，XMLHttpRequest 对象处于接收数据状态，XMLHttpRequest 对象的 readyState 属性值为 3。
+完成状态。XMLHttpRequest 对象接收数据完毕后，进入完成状态，此时 XMLHttpRequest 对象的 readyState 属性值为 4。此时接收完毕后的数据存入在客户端计算机的内存中，可以使用 responseText 属性或 responseXml 属性来获取数据。
+总的来说，readyState 属性的值有以下几种：
+
+0 (未初始化) or (请求还未初始化)
+1 (正在加载) or (已建立服务器链接)
+2 (加载成功) or (请求已接受)
+3 (交互) or (正在处理请求)
+4 (完成) or (请求已完成并且响应已准备好)
+只读属性 XMLHttpRequest.status 返回了 XMLHttpRequest 响应中的数字状态码。status 的值是一个无符号短整型。在请求完成前，status 的值为 0。值得注意的是，如果 XMLHttpRequest 出错，浏览器返回的 status 也为0：
+
+UNSENT（未发送） 0
+OPENED（已打开） 0
+LOADING（载入中） 200
+DONE（完成） 200
+var xhr = new XMLHttpRequest();
+console.log('UNSENT', xhr.readyState); // readyState 为 0
+
+xhr.open('GET', '/api', true);
+console.log('OPENED', xhr.readyState); // readyState 为 1
+
+xhr.onprogress = function () {
+console.log('LOADING', xhr.readyState); // readyState 为 3
+};
+
+xhr.onload = function () {
+console.log('DONE', xhr.readyState); // readyState 为 4
+};
+
+xhr.send(null);
+只有在XMLHttpRequest对象完成了以上5个步骤之后，才可以获取从服务器端返回的数据。因此，如果要获得从服务器端返回的数据，就必须要先判断XMLHttpRequest对象的状态：
+
+const xhr = new XMLHttpRequest();
+xmlHttpRequest.onreadystatechange = function () {
+if (xhr.readyState === 4 && xhr.status === 200) {
+// do something here
+}
+}
+\4. 发送HTTP请求
+XMLHttpRequest.send(data);
+结束
+最后，附上一个简单的完整 AJAX 实例：
+```
+
+## 2.快速上手
+
+```
+let xhr = new XMLHttpRequest()  //类似于开启用户代理
+//初始化，请求了代理对象
+console.log(xhr.readyState) //0, UNSENT
+xhr.open('get', '/text.php')    //类似于输入地址与方法
+//调用了open方法，建立了客户端与服务端的特定端口的连接
+console.log(xhr.readyState) //1, OPENED
+xhr.send(null)  // 类似于按下确认键, 参数为请求体
+//由于ajax请求可能需要花费比较长时间来获取响应数据，但是不能让用户等待，因此设计初衷就是异步，即类似用事件的形式
+xhr.onreadystatechange = function(){
+    switch(this.readyState){
+        case 2: 
+            //已经获取到了响应报文的响应头
+            console.log(xhr.readyState) //2, HEADERS_RECEIVED
+            console.log(xhr.getAllResponseHeaders)
+            console.log(xhr.responseText)   //没有数据
+            break
+        case 3:
+            //正在下载响应体中的数据
+            console.log(xhr.readyState) //3, LOADING
+            console.log(xhr.responseText)   //数据有可能完整也有可能不完整，与响应体大小跟网速有关
+            break
+        case 4:
+            //响应体中的数据下载完成
+            console.log(xhr.readyState) //4, LOADED
+            console.log(xhr.responseText)   //数据完整
+    }
+}
+xhr.onload = function(){    //HTML5, XHR v2.0发布事件
+    console.log(xhr.readyState)     //4
+}   
+//xhr.responseText`永远只会获取字符串形式的响应体
+//xhr.response`根据content-type的变化而变化
+```
+
+## 3.遵循http协议
+
+```
+let xhr = new XMLHttpRequest()
+ 
+console.log(xhr.readyState) 
+xhr.open('post', '/text.php')    
+//响应头中的content-type必须与请求体中的格式相同，否则服务端无法解析
+xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')  //设置响应头
+xhr.send('name1=value1&name2=value2')   //设置urlencoded的请求体
+ 
+xhr.onreadystatechange = function(){
+    if(this.readyState != 4) return
+    console.log(this.status)    //状态码
+    console.log(this.responseText)
+
+}
+```
+
+## 4.同步与异步
+
+```
+* `xhr.open`的第三个参数是async，默认为true，用来控制xhr是否以异步形式发送请求
+* 当以同步形式调用时，javascript会在`xhr.send`执行后直到收到响应为止进行等待
+
+## 响应数据格式
+
+* 影响到客户端的javascript如何对服务端返回的数据进行解析
+* 服务端需要设置合理的content-type来决定客户端如何对其进行解析
+
+### XML
+
+* 响应头为application/xml
+* 从responseXML中获取，且能通过dom操作来操作xml
+
+### JSON
+
+* 响应头为application/json
+
+## 兼容方案
+
+* 对于IE5/6需要使用兼容方案
+  `xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('microsoft.XMLHTTP')`
+ 
+```
+
+## 5.jQuery中的封装
+
+```
+<script>
+    function ajax(options){
+        options = options ||{};  //调用函数时如果options没有指定，就给它赋值{},一个空的Object
+        options.type=(options.type || "GET").toUpperCase();/// 请求格式GET、POST，默认为GET
+        options.dataType=options.dataType || "json";    //响应数据格式，默认json
+
+        var params=formatParams(options.data);//options.data请求的数据
+
+        var xhr;
+        //考虑兼容性
+        if(window.XMLHttpRequest){
+            xhr=new XMLHttpRequest();
+        }else if(window.ActiveObject){//兼容IE6以下版本
+            xhr=new ActiveXobject('Microsoft.XMLHTTP');
+        }
+
+        //启动并发送一个请求
+        if(options.type=="GET"){
+            xhr.open("GET",options.url+"?"+params,true);
+            xhr.send(null);
+        }else if(options.type=="POST"){
+            xhr.open("post",options.url,true);
+
+            //设置表单提交时的内容类型
+            //Content-type数据请求的格式
+            xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
+            xhr.send(params);
+        }
+
+    //    设置有效时间
+        setTimeout(function(){
+            if(xhr.readySate!=4){
+                xhr.abort();
+            }
+        },options.timeout)
+
+    //    接收
+    //     options.success成功之后的回调函数  options.error失败后的回调函数    //xhr.responseText,xhr.responseXML  获得字符串形式的响应数据或者XML形式的响应数据
+        xhr.onreadystatechange=function(){
+            if(xhr.readyState==4){
+                var status=xhr.status;
+                if(status>=200&& status<300 || status==304){
+                  options.success&&options.success(xhr.responseText,xhr.responseXML);
+                }else{
+                    options.error&&options.error(status);
+                }
+            }
+        }
+    }
+
+    //格式化请求参数
+    function formatParams(data){
+        var arr=[];
+        for(var name in data){
+            arr.push(encodeURIComponent(name)+"="+encodeURIComponent(data[name]));
+        }
+        arr.push(("v="+Math.random()).replace(".",""));
+        return arr.join("&");
+
+    }
+    //基本的使用实例
+    ajax({
+        url:"http://server-name/login",
+        type:'post',
+        data:{
+            username:'username',
+            password:'password'
+        },
+        dataType:'json',
+        timeout:10000,
+        contentType:"application/json",
+        success:function(data){
+　　　　　　。。。。。。//服务器返回响应，根据响应结果，分析是否登录成功
+        },        //异常处理
+        error:function(e){
+            console.log(e);
+        }
+    })
+</script>
+```
+
+## 6.同源策略
+
+```
+两个url必须协议，域名，端口都相等才属于同源，由于安全问题，默认只有同源的地址才能通过ajax来访问
+
+* 不同源地址之间如果需要相互请求，必须服务端与客户端配合
+```
+
+## 6.1跨域请求
+
+```
+跨域请求
++ JSONP
+
++ 配置代理
+
++ jsonp  代表传给后端回调函数名称的参数
+
++ jsonpCallback 具体回调函数名称
+```
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-30\347\254\224\350\256\260jQuery\345\216\237\347\224\237AJAX.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-30\347\254\224\350\256\260jQuery\345\216\237\347\224\237AJAX.md"
new file mode 100644
index 0000000000000000000000000000000000000000..0334864112c3fa72ef26fc75fc4e5314345dfcdb
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-11-30\347\254\224\350\256\260jQuery\345\216\237\347\224\237AJAX.md"
@@ -0,0 +1,130 @@
+### 一，原生AJAX
+
+#### 1，GET方法；传送数据量小，处理效率高，安全性低，会被缓存
+
+- send()中不需要添加任何参数,因为在连接服务器的时候就已经发送
+- get请求就不必要设置 xhr.setRequestHeader(header,value)
+
+```
+var newAj=new XMLHttpRequest();
+        newAj.open("GET","json练习.json",true);
+        newAj.send();
+        newAj.onreadystatechange=function(){
+            if (newAj.readyState==4) {
+                if (newAj.status==200) {
+                    var obj=JSON.parse(newAj.responseText);
+                    console.log(obj);
+                }
+            }
+        }
+```
+
+#### 2，post方法;传送数据量大，处理效率低，安全性高，不会被缓存
+
+- send()中需要添加参数，建议设置请求头
+- 参数可以是null或者xhr.send()|send(带有参数的)post请求在传递值的情况下必须 设置 xhr.setRequestHeader(header,value)
+
+```
+        var xhr = new XMLHttpRequest();
+        xhr.open('post', 'data.json', true);
+        xhr.send({ a: 100, b: 200 });
+        //设置行头
+        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+        xhr.onreadystatechange = function () {
+            if (xhr.readyState == 4 && xhr.status == 200) {
+                console.log(xhr.response['No1']);
+                // 手动转成对象
+                // var obj = JSON.parse(xhr.response);
+            }
+        }
+```
+
+#### 3.响应数据处理；将返回的json类型的数据转换成对象
+
+##### 1，手动转换
+
+```
+var obj = JSON.parse(xhr.response)
+console.log(obj.name)
+```
+
+##### 2，自动转换
+
+```
+//创建对象后设置:
+xhr.responseType = 'json';
+console.log(xhr.response.name)
+```
+
+### 二，jQuery Ajax
+
+#### 1，$.get()；执行get请求方式的ajax
+
+```
+    $('button').eq(0).click(
+        function () {
+            $.get('data.json',{a:100,b:200},function (data) {
+                console.log(data);
+            },'json');
+        }
+    )
+```
+
+#### 2，$.post()；执行post请求方式的ajax
+
+```
+    $('button').eq(1).click(
+        function () {
+            $.post('data.json',{a:100,b:200},function (data) {
+                console.log(data);
+            },'json');
+        }
+    )
+```
+
+#### 3，$.getJSON()
+
+- 通过Ajax获取服务器中JSON格式的数据
+- “全局方法”，直接定义在jQuery对象（即“$”）下的方法
+
+```
+    $('button').eq(2).click(
+        function () {
+            $.getJSON('data.json',function (data) {
+                console.log(data);
+            })
+        }
+    )
+```
+
+#### 4，$.getScript()；动态加载JavaScript的方法
+
+- 通过AJAX来获取并运行一个外部JavaScript文件
+- 异步跨域加载JavaScript文件，可避免提前加载JavaScript文件
+- 减少服务器和客户端的负 担，加快页面加载速度
+
+```
+    $('button').eq(3).click(
+        function () {
+            $.getScript('test.js');
+        }
+    )
+```
+
+#### 5，$.ajax()；核心方法，所有的其他方法都是在内部使用此方法
+
+- 以上方法用ajax（）都能实现
+
+```
+    $('button').eq(4).click(
+        function () {
+            $.ajax({
+                url:'data.json',
+                type:'get',
+                data:{a:100,b:200},
+                success:(data) => console.log(data),
+                error:()=> console.log('请求失败')
+            })
+        }
+    )
+```
\ No newline at end of file
diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-12-01\347\254\224\350\256\260jQueryPromise.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-12-01\347\254\224\350\256\260jQueryPromise.md"
new file mode 100644
index 0000000000000000000000000000000000000000..d418e8236239adc638044356663c51d6dd76e703
--- /dev/null
+++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-12-01\347\254\224\350\256\260jQueryPromise.md"
@@ -0,0 +1,48 @@
+## Promise
+
+### PromiseState
+
+在每个**promise**对象中，状态只会改变一次
+
+**pending**：准备中
+
+**fulfilled \**(成功) ：调用了\**resolve**函数，将状态改为成功
+
+**rejected** (失败) ：调用了**reject**函数，将状态改为失败
+
+### PromiseResult
+
+接收**resolve**或者**reject**中的参数
+
+```
+const p = new Promise((resolve, reject) => {
+    // resolve('这是成功');
+    reject('这是失败');  
+}).then(data =>{
+    console.log('成功then调用');
+    return 123
+    //catch:捕获异常
+}).catch(
+    function (e) {
+        console.log(e);
+    }
+)
+//then(成功时调用的函数,失败时调用的函数),返回值也是一个promise对象,pending
+console.log(p)
+```
+
+## GET
+
+```
+$('div').eq(0).one('mousemove', function () {
+    $.get('data.json', function (data) {
+        const { username } = data;
+        $.get('data1.json', function (data1) {
+        	const contact = data1[username]
+            $.get('data2.json', function (data2) {
+                console.log(username + ':' + data2[contact]);
+            })
+        })
+    })
+})
+```
\ No newline at end of file