From 2000a2734eda71186c921d5d0fc4ad4d50f56930 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E6=96=87=E9=BE=99?= <2717752887@qq.com> Date: Fri, 2 Dec 2022 04:50:41 +0000 Subject: [PATCH 1/3] =?UTF-8?q?2022-11.30=E7=AC=AC=E4=BA=8C=E5=8D=81?= =?UTF-8?q?=E5=9B=9B=E6=AC=A1=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 吴文龙 <2717752887@qq.com> --- ...33\346\254\241\347\254\224\350\256\260.md" | 70 +++++++++++++++++++ 1 file changed, 70 insertions(+) create mode 100644 "17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-11.30\347\254\254\344\272\214\345\215\201\345\233\233\346\254\241\347\254\224\350\256\260.md" diff --git "a/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-11.30\347\254\254\344\272\214\345\215\201\345\233\233\346\254\241\347\254\224\350\256\260.md" "b/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-11.30\347\254\254\344\272\214\345\215\201\345\233\233\346\254\241\347\254\224\350\256\260.md" new file mode 100644 index 0000000..ca00496 --- /dev/null +++ "b/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-11.30\347\254\254\344\272\214\345\215\201\345\233\233\346\254\241\347\254\224\350\256\260.md" @@ -0,0 +1,70 @@ +# JQuery + +##### 其他事件 + +解绑事件:$(this).off('要解绑的事件') + +只触发一次事件:$('元素').one('事件名',function(){ + +}) + + + +### 事件对象 + +事件对象什么时候产生:触发事件的时候 this + + + +##### 直接绑定 + +hover合成事件: + +鼠标移动的时候:mouseover mouseout(合成事件hover) + +事件的链式调用,为一个对象绑定多个事件: + +```js +$('button').mouseover( + function () { + $(this).css('color','red'); + } + ).mouseout( + function () { + $(this).css('color','black'); + } + ).click( + function () { + console.log('click'); + } + ) +``` + +bind():可以为多个事件绑定同一个函数: + +```js + $('button').bind('click ',function () { + console.log('这是bind'); + }) + +``` + +on():绑定 + +on可以为动态添加的元素进行事件绑定 + +```js +$(document).on('click','button',function () { + console.log('这是新创建的元素'); + }) +``` + + + +#### JQuery事件冒泡 + +##### JQuery实现不了事件捕获 + +阻止事件冒泡:**event.stopPropagation()** + +阻止默认行为:event.preventDefault() -- Gitee From 197bbd6c33e720a98dd131a86ef1f2d26300ca46 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E6=96=87=E9=BE=99?= <2717752887@qq.com> Date: Fri, 2 Dec 2022 04:51:13 +0000 Subject: [PATCH 2/3] =?UTF-8?q?2022-12.1=E7=AC=AC=E4=BA=8C=E5=8D=81?= =?UTF-8?q?=E4=BA=94=E6=AC=A1=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 吴文龙 <2717752887@qq.com> --- ...24\346\254\241\347\254\224\350\256\260.md" | 195 ++++++++++++++++++ 1 file changed, 195 insertions(+) create mode 100644 "17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\347\254\224\350\256\260.md" diff --git "a/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\347\254\224\350\256\260.md" "b/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\347\254\224\350\256\260.md" new file mode 100644 index 0000000..dfda3d1 --- /dev/null +++ "b/17\345\220\264\346\226\207\351\276\231/\347\254\224\350\256\260/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\347\254\224\350\256\260.md" @@ -0,0 +1,195 @@ +# JQuery + +##### JQuery方法 + +each(index,element):表示遍历JQuery对象集 中的所有元素对象 + +detach():保留事件,包括所有的文本和子节点,然后它会保留数据和事件 + +remove():移除元素及它的数据和事件 + +empty():从被选元素移除内容 + +clone(bool):返回一个复制元素,默认是false:只克隆元素,不克隆事件,参数为bool=true:表示将事件一起复制(需要创建一个来接收克隆的值) + +replaceWith(''):替换jQuery对象 + +类名过滤: 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。 + +反向过滤: 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()方法的精简版。 + +parent():找直接父级 + +parents():找所有父级() + +parentsUntil()方法是parents()方法的一个补充,它可以查找“指定范围”的所有祖先元 素,相当于在parents()方法返回的集合中截取一部分。 + +语法: + +``` +$().parentsUntil(selecotr) +``` + +说明: + +selector是一个可选参数,它是一个选择器,用来选择符合条件的祖先元素。 + +children() + +在jQuery中,我们可以使用children()方法来查找当前元素的“子元素”。注意,children()方法只能查找子元素,不能查找其他后代元素。 + +语法: + +``` +$().children(selector) +``` + +说明: + +selector是一个可选参数,它是一个选择器,用来查找符合条件的子元素。当参数省略,表示选择所有子元素;当参数不省略时,表示选择符合条件的子元素。 + +find() + +在jQuery中,我们可以使用find()方法来查找当前元素的“后代元素”。注意,**find()方法不仅能查找子元素,还能查找其他后代元素。** + +语法: + +``` +$().find(selector) +``` + +说明: + +selector是一个可选参数,它是一个选择器,用来查找符合条件的后代元素。**当参数省略,表示选择所有后代元素**;当参数不省略时,表示选择符合条件的后代元素。 + + + +##### 向前查找兄弟元素 + +prev() + +在jQuery中,我们可以使用prev()方法来查找某个元素的前一个“相邻”的兄弟元素。 + +语法: + +``` +$().prev() +``` + +prevAll() + +在jQuery中,我们可以使用prevAll()方法来查找某个元素前面“所有”兄弟元素。注意,prev()只会查找前面相邻的兄弟元素,而prevAll()则会查找前面所有的兄弟元素。 + +语法: + +``` +$().prevAll(selector) +``` + +说明:selector是一个可选参数,它是一个选择器,用来查找符合条件的兄弟元素。当参数省略,表示选择前 + +面所有兄弟元素;当参数不省略时,表示选择前面满足条件的兄弟元素。 + +prevUntil() + +##### 向后查找兄弟元素 + +next() + +nextAll() + +nextUntil() + +$().siblings('p') :查找所有兄弟元素 + +index() + +在jQuery中,我们可以使用index()方法来获取当前jQuery对象集合中“指定元素”的索引值。 + +``` +$(selector).index() +``` + +说明: + +index()方法可以接受一个“jQuery对象”或“DOM对象”作为参数,不过一般情况下,我们很少会使用到参 + +数。当index()不带参数时,一般指的是当前元素相对于父元素的索引值。 + + + + + + + -- Gitee From 6a6decd3a30ba465f9d5f1ca9685f57b5664da5a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E6=96=87=E9=BE=99?= <2717752887@qq.com> Date: Fri, 2 Dec 2022 04:51:54 +0000 Subject: [PATCH 3/3] =?UTF-8?q?2022-12.1=E7=AC=AC=E4=BA=8C=E5=8D=81?= =?UTF-8?q?=E4=BA=94=E6=AC=A1=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 吴文龙 <2717752887@qq.com> --- ...\346\254\241\344\275\234\344\270\232.html" | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 "17\345\220\264\346\226\207\351\276\231/\344\275\234\344\270\232/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\344\275\234\344\270\232.html" diff --git "a/17\345\220\264\346\226\207\351\276\231/\344\275\234\344\270\232/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\344\275\234\344\270\232.html" "b/17\345\220\264\346\226\207\351\276\231/\344\275\234\344\270\232/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\344\275\234\344\270\232.html" new file mode 100644 index 0000000..b97c303 --- /dev/null +++ "b/17\345\220\264\346\226\207\351\276\231/\344\275\234\344\270\232/2022-12.1\347\254\254\344\272\214\345\215\201\344\272\224\346\254\241\344\275\234\344\270\232.html" @@ -0,0 +1,24 @@ + + +
+ + + +