diff --git "a/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/20jQuery \344\272\213\344\273\266.md" "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/20jQuery \344\272\213\344\273\266.md"
new file mode 100644
index 0000000000000000000000000000000000000000..c050a4b36dadecdb8006e411bc45653c9cfe73cc
--- /dev/null
+++ "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/20jQuery \344\272\213\344\273\266.md"
@@ -0,0 +1,277 @@
+## jQuery 事件
+
+#### onload事件
+
+在JavaScript中，onload表示文档加载完成后再执行的一个事件。window.onload只能调用一次，如果多次调用，则只会执行最后一个。
+
+```html
+window.onload = function(){
+……
+}
+
+```
+
+对于JavaScript的onload事件来说，只有当页面所有DOM元素以及所有外部文件（图片、外部 CSS、外部JavaScript等）加载完成之后才会执行。这里的所有DOM元素，指的是HTML部分的代码。
+
+#### ready事件
+
+ 在jQuery中，ready也表示文档（document）加载完成后再执行的一个事件。
+
+```html
+$(document).ready(function(){
+ ……
+})
+
+```
+
+ 对于jQuery的ready事件来说，只要页面所有DOM元素加载完成就可以执行，不需要再等外部文件 （图片、外部CSS、外部JavaScript）加载完成。
+
+#### read事件的四种写法
+
+```
+//写法1：
+$(document).ready(function(){
+……
+})
+//写法2：
+jQuery(document).ready(function(){
+……
+})
+//写法3(最常用)：
+$(function(){
+……
+})
+//写法4：
+jQuery(function(){
+……
+})
+
+```
+
+
+
+#### 鼠标事件
+
+在jQuery中，常见的鼠标事件如下表:
+
+| 事件 | 说明 |
+| --------- | ------------ |
+| click | 鼠标单击事件 |
+| dblclick | 鼠标双击事件 |
+| mouseover | 鼠标移入事件 |
+| mouseout | 鼠标移出事件 |
+| mousedown | 鼠标按下事件 |
+| mouseup | 鼠标松开事件 |
+| mousemove | 鼠标移动事件 |
+| | |
+
+
+
+hover:mouseover+mousedown
+
+ jQuery 事件比JavaScript事件只是少了“on”前缀。例如鼠标单击事件在JavaScript中是onclick，而在jQuery中是 click。
+
+ jQuery事件的语法很简单，我们都是往事件方法中插入一个匿名函数function(){}
+
+
+
+
+
+#### 鼠标单击
+
+ 单击事件不只是按钮才有，我们可以为任何元素添加单击事件！
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+ 调试代码
+
+
+
+```
+
+
+
+**练习:有单击事件:alert('我是单击') 有双击事件 alert('我是双击')**
+
+**思考:如何触发双击事件时不触发单击事件**
+
+
+
+#### 鼠标移入移出
+
+ 当用户将鼠标移入到某个元素上面时，就会触发mouseover事件。如果将鼠标移出某个元素时，就 会触发mouseout事件。mouseover和mouseout平常都是形影不离的。
+
+```js
+//鼠标到文字上变色，移开变色
+Javascript
+```
+
+
+
+**练习：一级菜单--》二级菜单**
+
+
+
+#### 鼠标按下和松开
+
+ 当用户按下鼠标时，会触发mousedown事件；当用户松开鼠标时，则会触发mouseup事件。 mousedown表示鼠标按下的一瞬间所触发的事件，而mouseup表示鼠标松开的一瞬间所触发的事 件。当然我们都知道，只有“先按下”才能“再松开”。
+
+
+
+#### 键盘事件
+
+在jQuery中，常用的键盘事件共有2种。
+
+1. 键盘按下：keydown
+
+2. 键盘松开：keyup
+
+keydown表示键盘按下一瞬间所触发的事件，而keyup表示键盘松开一瞬间所触发的事件。对于键盘来
+
+说，都是先有“按下”才有“松开”，也就是keydown发生在keyup之前。
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+ 字符串长度为： 0
+
+
+
+```
+
+
+
+#### 表单事件
+
+##### 1. focus和blur
+
+focus表示获取焦点时触发的事件，而blur表示失去焦点时触发的事件，两者是相反操作。
+
+focus和blur这两个事件往往都是配合一起使用的。例如用户准备在文本框中输入内容时，此时它会获得
+
+光标，就会触发focus事件。当文本框失去光标时，就会触发blur事件。
+
+并不是所有的HTML元素都有焦点事件，具有“获取焦点”和“失去焦点”特点的元素只有两种。
+
+1. **表单元素（单选框、复选框、单行文本框、多行文本框、下拉列表）**
+
+2. **超链接**
+
+判断一个元素是否具有焦点很简单，我们打开一个页面后按Tab键，能够选中的就是带有焦点特性的元
+
+素。在实际开发中，焦点事件（focus和blur）一般用于单行文本框和多行文本框，其他地方比较少见。
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+##### 2. select
+
+在jQuery中，当我们选中“单行文本框”或“多行文本框”中的内容时，就会触发select事件。
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+##### **3. change**
+
+在jQuery中，change事件常用于“具有多个选项的表单元素”。
+
+1. 单选框选择某一项时触发。
+2. 复选框选择某一项时触发。
+3. 下拉菜单选择某一项时触发。
+
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
diff --git "a/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/21jQuery\344\272\213\344\273\266\345\257\271\350\261\241.md" "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/21jQuery\344\272\213\344\273\266\345\257\271\350\261\241.md"
new file mode 100644
index 0000000000000000000000000000000000000000..050298292ebefbf292f66dbc77455e25a25a8e0d
--- /dev/null
+++ "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/21jQuery\344\272\213\344\273\266\345\257\271\350\261\241.md"
@@ -0,0 +1,209 @@
+## jQuery事件对象
+
+### jQuery事件绑定扩展
+
+
+
+#### 绑定事件的三种类型
+
+##### 直接绑定(最简单也是最常用)
+
+语法:
+
+```js
+$(selector).event(function(){})
+```
+
+##### bind绑定
+
+语法:
+
+```js
+$(selector).off(event,selector,function(eventObj),map)
+```
+
+ 
+
+```html
+eg:对btn进行绑定点击事件
+
+```
+
+
+
+##### on()绑定
+
+在jQuery中，我们可以使用on()方法为“已经存在的元素”绑定事件。
+
+语法:
+
+```js
+$(selector).on(event,childSelector,data,function)
+```
+
+ on绑定与前两个绑定最大的区别是on可以为动态创建的元素绑定事件
+
+ 
+
+```html
+<--eg:对.btn进行绑定点击事件，点击.btn后会新增另一个.btn按钮-->
+
+```
+
+
+
+##### 合成事件hover
+
+通常来说，mouseover和mouseout是一对形影不离的事件，而且实际工作中用的比较多。所以jQuery中定义了hover事件表示这两事件的触发
+
+语法:
+
+```js
+$().hover(fn1, fn2)
+```
+
+参数fn1表示鼠标移入事件触发的处理函数，参数fn2表示鼠标移出事件触发的处理函数。
+
+
+
+##### 解绑事件
+
+我们可以使用off()方法来解除元素绑定的事件。jQuery的off()方法，有点类似于JavaScript的
+
+removeEventListener()方法。
+
+语法：
+
+```html
+$(selector).off(type) 移除所有事件:off()
+```
+
+ type是可选参数，表示事件类型。例如单击事件是"click"，按下事件是"mousedown"，以此类推。如果参数省略，表示移除当前元素中的所有事件。
+
+ 此外，off()方法不仅可以用来解除使用“基本事件”方式添加的事件，还可以用来解除“绑定事件”添加的事
+
+件。
+
+```html
+
+
+```
+
+
+
+##### 一次事件
+
+语法:
+
+```js
+$(selector).one(type, fn)
+```
+
+```html
+<--eg:使按钮只点击一次-->
+
+```
+
+###
+
+
+
+### jQuery事件对象
+
+
+
+
+
+#### 事件对象
+
+ 当一个事件发生的时候，这个事件有关的详细信息都会临时保存到一个指定的地方，这个地方就是 event对象。每一个事件，都有一个对应的event对象。给大家打个比喻，我们都知道飞机都有黑匣子， 对吧？每次飞机出事（一个事件）后，我们都可以从黑匣子（event对象）中获取详细的信息。
+
+ 在jQuery中，我们可以通过event对象来获取一个事件的详细信息。以下是常用的属性：
+
+| 属性 | 说明 |
+| :----------: | :--------------: |
+| type | 事件类型 |
+| target | 事件元素 |
+| which | 鼠标左，中，右键 |
+| pageX，pageY | 鼠标坐标 |
+| shiftKey | 是否按下shift键 |
+| altKey | 是否按下alt键 |
+| keyCode | 键码值 |
+| | |
+
+##### event.type
+
+在jQuery中，我们可以使用event对象的type属性来获取事件的类型。
+
+##### event.which
+
+在jQuery中，我们可以使用event对象的which属性来获取单击事件中鼠标的左、中、右键。
+
+说明：
+event.which会返回一个数字，其中1表示左键，2表示中键，3表示右键。
+
+```js
+
+
+
+
+
+
+
+
+
+
+百度一下
+
+
+```
+
+
+
+##### shiftKey/altKey/ctrlKey
+
+```
+eg:禁止使用Shfit、Ctrl、Alt键
+```
+
+#### 键码值keyCode
+
+```
+eg:获取“上、下、左、右”方向键
+```
+
+##### event.target
+
+在jQuery中，我们可以使用event对象的target属性来获取触发事件的元素。
+
+**面试题：****event.target 和 event.currenttarget与delegatetarget的区别**
+
+
+
+
+
+#### jQuery事件冒泡
+
+**jQuery实现不了事件捕获**
+
+阻止事件冒泡：**event.stopPropagation()**
+
+阻止默认行为：event.preventDefault()
+
+```js
+eg:阻止form表单提交
+$('form').submit(function (e) {
+ e.preventDefault();
+
+});
+```
+
diff --git "a/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/22jQuery\346\226\271\346\263\225.md" "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/22jQuery\346\226\271\346\263\225.md"
new file mode 100644
index 0000000000000000000000000000000000000000..58d7e28806f1877fc19cde73e9bd6b1cfc7d6f82
--- /dev/null
+++ "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/22jQuery\346\226\271\346\263\225.md"
@@ -0,0 +1,444 @@
+## jQuery方法
+
+### 元素方法
+
+#### 遍历元素each()
+
+在操作DOM时，很多时候我们需要对“同一类型”的所有元素进行相同的操作。如果使用JavaScript来实现，我们往往都是先获取元素的长度，然后使用循环来访问每一个元素，代码量比较大。在jQuery中，我们可以使用each()方法轻松实现元素的遍历操作。
+
+语法：
+
+```js
+$('li').each(function(index, element){ …… })
+```
+
+each()方法接收一个匿名函数作为参数，该函数有两个参数：index，element。
+
+index是一个可选参数，它表示元素的索引号（即下标）。通过形参index以及配合this关键字，我
+
+们就可以轻松操作每一个元素。此外注意一点，形参index是从0开始的。
+
+element是一个可选参数，它表示当前元素，可以使用(this)代替。也就是说，(element)等价于
+
+$(this)。
+
+如果需要退出each循环，可以在回调函数中返回false，也就是return false即可。
+
+
+
+
+
+练习：为每个li设置不同的背景颜色
+
+var colors=["red","orange","yellow","green","blue"];
+
+```
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+#### DOM创建元素
+
+- DOM创建: var $p = $('这是一段文本
>')
+- 插入元素
+- prepend() 和 prependTo()
+- append() 和 appendTo()
+- before() 和insertBefore()
+- after() 和 insertAfter()
+
+
+
+#### 删除元素
+
+##### remove()：全部删除
+
+##### detach():删除，保留事件
+
+##### empty():清空元素，保留标签
+
+#### 复制元素
+
+语法：
+
+```
+$().clone(bool): true:深拷贝将事件和元素一起拷贝 false：只拷贝元素
+```
+
+
+
+#### 替换元素
+
+##### replaceWith()
+
+##### replaceAll()
+
+
+
+#### 包裹元素
+
+##### wrap()
+
+##### wrapAll()
+
+##### wrapInner()
+
+### 过滤方法
+
+#### 类名过滤: hasClass()
+
+ 类名过滤，指的是根据元素的class来过滤。在jQuery中，我们可以使用hasClass()方法来实现类名
+
+过滤。语法:
+
+```html
+$().hasClass(“类名”)
+```
+
+hasClass()方法一般用于判断元素是否包含指定的类名：如果包含，则返回true；如果不包含，则
+返回false。
+
+
+
+#### 下标过滤: eq()
+
+ 下标过滤，指的是根据元素集合的下标来过滤。在jQuery中，我们可以使用eq()方法来实现下标过 滤。
+
+语法：
+
+```js
+$().eq(n)
+```
+
+ 说明： n是一个整数，从0开始。当取值为正整数时，eq(0)获取的是第1个元素，eq(1)获取的是第2个元素，……，以此类推。 当取值为负整数时，eq(-1)获取的是倒数第1个元素，eq(-2)获取的是倒数第2个元素，……，以此类 推。
+
+#### 判断过滤: is()
+
+ 判断过滤，指的是根据某些条件进行判断，然后选取符合条件的元素。在jQuery中，我们可以使用is()方法来实现判断过滤。
+
+语法：
+
+```
+$().is(selector)
+```
+
+说明：
+
+参数selector是一个选择器。is()方法用于判断当前选择的元素集合中，是否存在符合条件的元素。
+
+如果存在，则返回true；如果不存在，则返回false。
+
+```js
+//判断元素是否可见
+$().is(":visible")
+//判断元素是否处于动画中
+$().is(":animated")
+//判断单选框或复选框是否被选中
+$().is(":checked")
+//判断当前元素是否第一个子元素
+$(this).is(":first-child")
+//判断文本中是否包含jQuery这个词
+$().is(":contains('jQuery')")
+//判断是否包含某些类名
+$().is(".select")
+```
+
+练习：全选反选
+
+```js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+#### 反向过滤: not():排除符合条件的
+
+在jQuery中， 我们还可以使用not()方法来过滤“不符合条件”的元素，并且返回余下符合条件的元素。
+
+其中，not()方法可以使用选择器过滤，也可以使用函数过滤。
+
+语法：
+
+```
+$().not(selector或fn)
+```
+
+
+
+#### 选择器过滤: filter()
+
+选择器过滤，指的是使用选择器来选取符合条件的元素。
+
+语法：
+
+```js
+$().filter(selector or fn)
+```
+
+
+
+#### has():过滤子代元素
+
+在jQuery中，表达式过滤除了可以使用filter()访问外，我们还可以使用has()方法。has()方法虽然没有filter()方法那么强大，**但是它的运行速度比较快**。
+
+语法：
+
+```
+$().has(selector)
+```
+
+说明：
+
+参数selector是一个选择器。 has()方法与filter()方法功能相似，不过has()方法只有选择器过滤，没有函数过滤。因此我们可以把has() 方法看成是filter()方法的精简版。
+
+
+
+### 查找祖先元素
+
+```js
+
+
+
+
+
+
+
+
+
+
+
+
+
子元素
+
子元素
+
+
子元素
+
子元素
+
+ - 红：red
+ - 橙：orange
+ - 黄：yellow
+ - 绿：green
+ - 青：cyan
+ - 蓝：blue
+ - 紫：purple
+
+
+
+
+```
+
+
+
+#### prev()
+
+在jQuery中，我们可以使用prev()方法来查找某个元素的前一个“相邻”的兄弟元素。
+
+语法：
+
+```
+$().prev()
+```
+
+#### **prevAll()**
+
+在jQuery中，我们可以使用prevAll()方法来查找某个元素前面“所有”兄弟元素。注意，prev()只会查找前面相邻的兄弟元素，而prevAll()则会查找前面所有的兄弟元素。
+
+语法：
+
+```
+$().prevAll(selector)
+```
+
+说明：selector是一个可选参数，它是一个选择器，用来查找符合条件的兄弟元素。当参数省略，表示选择前
+
+面所有兄弟元素；当参数不省略时，表示选择前面满足条件的兄弟元素。
+
+#### prevUntil()
+
+### 向后查找兄弟元素
+
+#### next()
+
+#### nextAll()
+
+#### nextUntil()
+
+
+
+#### $().siblings('p') :查找所有兄弟元素
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+#### 4.8 index()
+
+在jQuery中，我们可以使用index()方法来获取当前jQuery对象集合中“指定元素”的索引值。
+
+```
+$(selector).index()
+```
+
+说明：
+
+index()方法可以接受一个“jQuery对象”或“DOM对象”作为参数，不过一般情况下，我们很少会使用到参
+
+数。当index()不带参数时，一般指的是当前元素相对于父元素的索引值。
+
+
+
+
+
+练习：
+
+1.分别使用filter实现带有class属性的文本（jQuery）变红
+
+```js
+
+
+
+
+
+
+
+
+
+
+
+
+ - HTML
+ - CSS
+ - JavaScript
+ - jQuery
+ - Vue.js
+
+
+
+
+```
+
diff --git "a/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/23 Ajax.md" "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/23 Ajax.md"
new file mode 100644
index 0000000000000000000000000000000000000000..321f7cedb5fd95f739fd8d9021f991b8173b8b0b
--- /dev/null
+++ "b/15\351\231\210\347\253\213\346\231\272/\347\254\224\350\256\260/23 Ajax.md"
@@ -0,0 +1,79 @@
+## jQuery Ajax
+
+**Ajax 是一种异步、无刷新(或者说局部页面刷新)技术。**
+
+#### $.get()
+
+语法：$.get(url, data, fn, type)
+
+| 参数 | 说明 |
+| :--: | :--------------------------------- |
+| url | 必选参数，表示被加载的页面地址 |
+| data | 可选参数，表示发送到服务器的数据 |
+| fn | 可选参数，表示请求成功后的回调函数 |
+| type | 可选参数，表示服务器返回的内容格式 |
+
+参数type返回的内容格式包括：text、html、xml、json、script或default。
+
+
+
+#### $.post()
+
+语法：$.post(url,data,fn,type)
+
+#### $.getJSON()
+
+语法：$.getJSON(url ,data, function(data){……})
+
+```json
+ [
+ {
+ "name": "刘备",
+ "sex": "男",
+ "age": 24
+ },
+ {
+ "name": "关羽",
+ "sex": "男",
+ "age": 24
+ },
+ {
+ "name": "小乔",
+ "sex": "女",
+ "age": 23
+ }
+ ]
+```
+
+
+
+#### $.getScript()
+
+语法：$.getScript(url, fn)
+
+| 参数 | 说明 |
+| ---- | ---------------------------------------- |
+| url | 必选参数，表示被加载的JavaScript文件路径 |
+| fn | 可选参数，表示请求成功后的回调函数 |
+
+#### $.ajax()
+
+上述方法都是ajax的简化版，它们能实现的功 能，.ajax()都能实现，因为$.ajax()是最底层的方法。
+
+语法：$.ajax(options)
+
+| **参数** | **说明** |
+| ----------- | ------------------------------------------------------- |
+| **url** | **被加载的页面地址** |
+| **type** | **数据请求方式，“get"或"post”，默认为"get"** |
+| **data** | 发送到服务器的数据，可以是字符串或对象 |
+| dataType | 服务器返回数据的类型，如：text、html、script、json、xml |
+| beforeSend | 发送请求前可以修改XMLHttpRequest对象的函数 |
+| complete | 请求“完成”后的回调函数 |
+| **success** | 请求“成功”后的回调函数 |
+| **error** | 请求“失败”后的回调函数 |
+| timeout | 请求超时的时间，单位为“毫秒” |
+| global | 是否响应全局事件，默认为true（即响应） |
+| async | 是否为异步请求，默认为true（即异步） |
+| cache | 是否进行页面缓存，true表示缓存，false表示不缓存 |
+