From 5b6cf48e4d7c7533bc661495bc85a7c60ad143b6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=96=E6=9D=B0=E6=9E=97?= <2890111060@qq.com>
Date: Thu, 24 Nov 2022 10:46:52 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
...21--jQuery Dom\346\223\215\344\275\234.md" | 433 ++++++++++++++++++
.../2022-11-22--JQuery.md" | 271 +++++++++++
...11-23--jQuery \344\272\213\344\273\266.md" | 374 +++++++++++++++
3 files changed, 1078 insertions(+)
create mode 100644 "46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-21--jQuery Dom\346\223\215\344\275\234.md"
create mode 100644 "46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-22--JQuery.md"
create mode 100644 "46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-23--jQuery \344\272\213\344\273\266.md"
diff --git "a/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-21--jQuery Dom\346\223\215\344\275\234.md" "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-21--jQuery Dom\346\223\215\344\275\234.md"
new file mode 100644
index 0000000..7e9ee50
--- /dev/null
+++ "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-21--jQuery Dom\346\223\215\344\275\234.md"
@@ -0,0 +1,433 @@
+# jQuery Dom 操作
+
+## 1.操作元素的属性
+
+### 1.1属性的分类：
+
+固有属性:标签本身就有的属性,
+
+返回值是bool的属性:checked, selected, disabled
+
+自定义属性:用户自己定义的属性
+
+### 1.2获取属性
+
+| 方法 | 说明 | 举例 |
+| -------------- | ------------------------------------------------------------ | --------------------------------- |
+| attr(属性名称) | 获取指定的属性值，操作checkbox时
选中返回checked，没有选中返回undefined。 | attr('checked')
attr('name') |
+| prop(属性名称) | 获取具有true和false两个属性的属性值 | prop('checked') |
+
+```js
+
+
+
+ //如果在此自定义一个属性 input没有这个属性 attr仍然可以获取到
+
+
+
+
+```
+
+### 1.3设置属性
+
+```js
+//设置属性:attr('属性名','属性值')
+
+
+
+
+
+
+```
+
+### 1.4移除属性
+
+```js
+removeAttr('属性名')
+```
+
+## 2. 操作元素的样式
+
+ 对于元素的样式，也是一种属性，由于样式用得特别多，所以对于样式除了当做属性处理外还可以有专门的方法进行处理。
+
+| 方法 | 说明 |
+| ---------------------- | --------------------------- |
+| attr('class') | 获取属性的值，即样式名称 |
+| attr('class','样式名') | 修改class属性的值，修改样式 |
+| addClass('样式名') | 添加样式名称 |
+| css() | 添加具体的样式 |
+| removeClass(class) | 移除样式名称 |
+
+### css()表示增加具体样式：
+
+```js
+1. css('样式名','样式值')
+ 例: css('color','red')
+
+2. css({'样式名':'样式值','样式名2':'样式值2'})
+ 例: css({'background-color':'red','color':'red'})
+```
+
+### 样式的增加 修改(设置) 以及移除
+
+```js
+
+
+
+
+
+
+ Document
+
+
+
+ 背景天蓝色
+ 红色
+ 背景天蓝色
+
+
+
+
+```
+
+## 3.操作元素内容
+
+| 方法 | 说明 |
+| ----------------- | ---------------------------------- |
+| html() | 获取元素的html内容 |
+| html('html,内容') | 设定元素的内容 |
+| text() | 获取元素的内容，不识别html标签 |
+| text('text 内容') | 设置元素的文本内容，不识别html标签 |
+| val() | 获取元素的值（表单元素） |
+| val('值') | 设定元素的值 |
+
+常见的表单元素(可以操作的):文本框，密码框，单选框，复选框，隐藏域，文本域，下拉框
+
+非表单元素:div,span,h1~h6,table,tr,td,li,p等
+
+```js
+
+
+
+
+
+
+ Document
+
+
+
+ 龙岩
+ 龙岩
+
+
+ 泡面
+
+
+
+
+
+
+```
+
+### 3.1创建元素
+
+```js
+ //创建元素： $('元素内容');
+ //例如： $('this is a paragraph!!!
')
+
+
+
+
+
+
+ Document
+
+
+ 龙岩
+ 龙岩
+
+
+ 泡面
+
+
+
+
+
+```
+
+### 3.2 添加元素
+
+| 方法 | 说明 |
+| ------------------------------ | ------------------------------------------------------------ |
+| 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) |
+
+```js
+
+
+
+
+
+
+ Document
+
+
+ 龙岩
+ 龙岩
+
+
+ 泡面
+
+
+
+
+
+```
+
+### 3.3删除元素
+
+| 方法 | 说明 |
+| -------- | ---------------------------------------------------- |
+| remove() | 删除所选元素或指定的子元素，包括整个标签和内容一起删 |
+| empty() | 清除所选元素的内容 |
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+ 删除元素
+ jquery
+ javascript
+ linux
+ java
+
+
+
+
+```
+
+### 3.1遍历元素
+
+each()
+
+$(selector).each(function(index,element)):遍历元素
+
+参数function为遍历时的回调函数
+
+index 为遍历元素的序列号，从0开始
+
+element为当前的元素(===this)，此时是dom元素
+
+```js
+
+
+
+
+
+
+ Document
+
+
+
+ 删除元素
+ jquery
+ javascript
+ linux
+ java
+
+
+
+
+```
+
diff --git "a/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-22--JQuery.md" "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-22--JQuery.md"
new file mode 100644
index 0000000..782d876
--- /dev/null
+++ "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-22--JQuery.md"
@@ -0,0 +1,271 @@
+# JQuery
+
+## 1.选择器
+
+### 1.1基础选择器
+
+| 选择器 | 名称 | 举例 |
+| :------------: | :---------------------------: | :-----------------------------------------------------: |
+| id选择器 | #id | $('#testDiv'):选择id为testDiv的元素 |
+| 元素名称选择器 | element | $('div'):选择所有div元素 |
+| 类选择器 | .class | $('.blue'):选择所有class=blue的的元素 |
+| 选择所有元素 | * | $('*'):选择页面所有元素 |
+| 群组选择器 | selector1,selector2,selector3 | $('#testDiv, span, blue'):同时选择多个选择器匹配的元素. |
+
+```js
+//1.标签选择器(元素名称选择器)：直接将标签名放到括号中
+var btn = $('button');
+console.log(btn);
+
+//2.id选择器
+
+ 这是一个div
+
+
+
+
+
+//4.选择所有元素：获取所有的元素节点(了解)
+
+ 这是一个div
+
+
+
+
+```
+
+### 1.2层次选择器
+
+| 选择器 | 名称 | 举例 |
+| ---------- | ------------------- | -------------------------------------------------- |
+| 后代选择器 | ancestor descendant | $('#parent div'):选择id为parent的元素的所有div元素 |
+| 子代选择器 | parent > child | $('#parent>div'):选择id为parent的直接div子元素 |
+| 相邻选择器 | prev + next | $('.blue + img'):选择css类为blue的下一个img元素 |
+| 同辈选择器 | prev ~sibling | $('.blue ~ img'):选择css类为blue的之后的img元素 |
+
+```js
+
+ 层次选择器
+
父选择器
+
子选择器
+
+
+
+
+
+
+ - HTML
+ - CSS
+ - JavaScript
+ - jQuery
+ - jQuery
+ - Vue.js
+
+
+
+
+```
+
+## 2.伪类选择器
+
+ 伪类选择器，可以看成是一种特殊的选择器。其中，伪类选择器都是以英文冒号（:）开头的。
+
+jQuery参考CSS伪类选择器的形式，为我们提供了大量的伪类选择器，常用的包括以下6种。
+
+1. “位置”伪类选择器
+
+2. “子元素”伪类选择器
+
+3. “可见性”伪类选择器
+
+4. “内容”伪类选择器
+
+5. “表单”伪类选择器
+
+6. “表单属性”伪类选择器
+
+#### 2.5表单伪类选择器
+
+| Forms | 名称 | 举例 |
+| -------------- | --------- | ------------------------------------------------------------ |
+| 表单选择器 | :input | 查找所有input元素: $(':input');
注意：会匹配所有的input, textarea,select和button元素 |
+| 文本框选择器 | :text | 查找所有的文本框: $(':text') |
+| 密码框选择器 | :password | 查找所有密码框 |
+| 单选按钮选择器 | :radio | 查找所有单选按钮 |
+| 复选框选择器 | :checkbox | 查找所有复选框 |
+| 提交按钮选择器 | :submit | 查找所有提交按钮 |
+| 图像域选择器 | :image | 查找所有图像域 |
+| 重置按钮选择器 | :reset | 查找所有重置按钮 |
+| 按钮选择器 | :button | 查找所有按钮 |
+| 文本域选择器 | :file | 查找所有文本域 |
+
+```js
+
+
+
+
+
+
+```
+
+#### 2.6 表单属性伪类选择器
+
+表单属性伪类选择器，指的是根据表单元素的属性来选取的一种伪类选择器。在jQuery中，常见的
+
+表单属性伪类选择器如下表所示。
+
+| 选择器 | 说明 |
+| :--------: | :----------------------------------------------------: |
+| :checked | 选取所有被选中的表单元素，一般是**单选框**或**复选框** |
+| :selected | 选取被选中的表单元素的选项，一般是**下拉列表** |
+| :enabled | 选取所有可用的表单元素 |
+| :disabled | 选取所有不可用的表单元素 |
+| :read-only | 选取所有的表单元素除了只读 |
+| :focus | 选取所有获得焦点的表单元素 |
+
+```js
+
+
+
+
+
+
+```
+
diff --git "a/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-23--jQuery \344\272\213\344\273\266.md" "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-23--jQuery \344\272\213\344\273\266.md"
new file mode 100644
index 0000000..a600f9a
--- /dev/null
+++ "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-23--jQuery \344\272\213\344\273\266.md"
@@ -0,0 +1,374 @@
+# jQuery 事件
+
+## 1.onload事件
+
+在JavaScript中，onload表示文档加载完成后再执行的一个事件。window.onload只能调用一次，如果多次调用，则只会执行最后一个。
+
+```html
+window.onload = function(){
+……
+}
+
+```
+
+对于JavaScript的onload事件来说，只有当页面所有DOM元素以及所有外部文件（图片、外部 CSS、外部JavaScript等）加载完成之后才会执行。这里的所有DOM元素，指的是HTML部分的代码。
+
+## 2.ready事件
+
+在jQuery中，ready也表示文档（document）加载完成后再执行
+
+```js
+ //$(document).ready(function(){
+ // ……
+ //})
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+```
+
+对于jQuery的ready事件来说，只要页面所有DOM元素加载完成就可以执行，不需要再等外部文件 （图片、外部CSS、外部JavaScript）加载完成。
+
+## 3.read事件的四种写法
+
+```js
+//写法1：
+$(document).ready(function(){
+……
+})
+//写法2：
+jQuery(document).ready(function(){
+……
+})
+//写法3(最常用)：
+$(function(){
+……
+})
+//写法4：
+jQuery(function(){
+……
+})
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+```
+
+## 4.鼠标事件
+
+在jQuery中，常见的鼠标事件如下表:
+
+| 事件 | 说明 |
+| --------- | ------------ |
+| click | 鼠标单击事件 |
+| dblclick | 鼠标双击事件 |
+| mouseover | 鼠标移入事件 |
+| mouseout | 鼠标移出事件 |
+| mousedown | 鼠标按下事件 |
+| mouseup | 鼠标松开事件 |
+| mousemove | 鼠标移动事件 |
+
+jQuery 事件比JavaScript事件只是少了“on”前缀。例如鼠标单击事件在JavaScript中是onclick，而在jQuery中是 click。
+
+ jQuery事件的语法很简单，我们都是往事件方法中插入一个匿名函数function(){}
+
+```js
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+```
+
+## 5.键盘事件
+
+在jQuery中，常用的键盘事件共有2种。
+
+1. 键盘按下：keydown
+
+2. 键盘松开：keyup
+
+keydown表示键盘按下一瞬间所触发的事件，而keyup表示键盘松开一瞬间所触发的事件。对于键盘来
+
+说，都是先有“按下”才有“松开”，也就是keydown发生在keyup之前。
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+ 字符串长度为： 0
+
+
+
+
+```
+
+## 6.表单事件
+
+### 6.1 focus和blur
+
+focus表示获取焦点时触发的事件，而blur表示失去焦点时触发的事件，两者是相反操作。
+
+focus和blur这两个事件往往都是配合一起使用的。例如用户准备在文本框中输入内容时，此时它会获得
+
+光标，就会触发focus事件。当文本框失去光标时，就会触发blur事件。
+
+并不是所有的HTML元素都有焦点事件，具有“获取焦点”和“失去焦点”特点的元素只有两种。
+
+1. **表单元素（单选框、复选框、单行文本框、多行文本框、下拉列表）**
+
+2. **超链接**
+
+判断一个元素是否具有焦点很简单，我们打开一个页面后按Tab键，能够选中的就是带有焦点特性的元
+
+素。在实际开发中，焦点事件（focus和blur）一般用于单行文本框和多行文本框，其他地方比较少见。
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+```
+
+### 6.2 select
+
+在jQuery中，当我们选中“单行文本框”或“多行文本框”中的内容时，就会
+
+```js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+### **6.3 change**
+
+在jQuery中，change事件常用于“具有多个选项的表单元素”。
+
+1. 单选框选择某一项时触发。
+2. 复选框选择某一项时触发。
+3. 下拉菜单选择某一项时触发。
+
+```js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
--
Gitee
From de2704afbd2bb90a053bc09ce9f5eba4ea75322f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=96=E6=9D=B0=E6=9E=97?= <2890111060@qq.com>
Date: Mon, 28 Nov 2022 08:04:07 +0800
Subject: [PATCH 2/2] ikun
---
...21\345\256\232\344\272\213\344\273\266.md" | 240 ++++++++++++++++++
1 file changed, 240 insertions(+)
create mode 100644 "46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-24--jQuery\347\273\221\345\256\232\344\272\213\344\273\266.md"
diff --git "a/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-24--jQuery\347\273\221\345\256\232\344\272\213\344\273\266.md" "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-24--jQuery\347\273\221\345\256\232\344\272\213\344\273\266.md"
new file mode 100644
index 0000000..f062073
--- /dev/null
+++ "b/46\350\265\226\346\235\260\346\236\227/\347\254\224\350\256\260/2022-11-24--jQuery\347\273\221\345\256\232\344\272\213\344\273\266.md"
@@ -0,0 +1,240 @@
+# jQuery事件
+
+## bind：针对多个事件绑定 同一个函数
+
+### 1.1多个事件绑定同一个函数bind('事件类型',函数)
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+ 字符串长度为： 0
+
+
+
+
+```
+
+### 1.2不同事件绑定不同函数，使用 键值对
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+ 字符串长度为： 0
+
+
+
+
+```
+
+## on: 为动态元素绑定事件
+
+给动态创建出来的元素绑定一个事件
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+ 字符串长度为： 0
+
+
+
+
+
+
+
+
+```
+
+## off( )：解绑事件
+
+```js
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+
+```
+
--
Gitee