From bfb4c519bbf2653d296e35589bf4d4bc06cb52a8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=AD=A4=E4=B8=9C?= <3352403143@qq.com> Date: Thu, 24 Nov 2022 12:20:26 +0800 Subject: [PATCH 1/5] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../2022.11.23/1.html" | 34 +++++++++++++++ ...& \344\272\213\344\273\266\346\265\201.md" | 42 +++++++++++++++++++ 2 files changed, 76 insertions(+) create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.23/1.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.23/DOM & \344\272\213\344\273\266\346\265\201.md" diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.23/1.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.23/1.html" new file mode 100644 index 0000000..35a9c36 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.23/1.html" @@ -0,0 +1,34 @@ + + + + + + + Document + + + + + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.23/DOM & \344\272\213\344\273\266\346\265\201.md" "b/33\347\275\227\346\255\244\344\270\234/2022.11.23/DOM & \344\272\213\344\273\266\346\265\201.md" new file mode 100644 index 0000000..5b4bd8f --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.23/DOM & \344\272\213\344\273\266\346\265\201.md" @@ -0,0 +1,42 @@ +# DOM & 事件流 + +###### DOM 0 + +当有多个同类型事件触发时,只会触发一个 ,兼容性较高(同名会被覆盖) + +实例: + +```js +var btn = document.querySelector('button'); +点击 + + function aler() { + + btn.onclick = function () { + + alert('全是帅哥'); + +} + + } + +优先级更高 + + btn.onclick = function () { + + alert('全是学霸'); + +} +``` + + + +###### DOM 2 + +当有多个同类型事件触发时,会依次触发, 兼容性较差 + +##### 事件流 + +事件从最外层开始捕获,直到当前元素(触发事件的对象),再从当前元素向外冒泡到document + +addEventListener('click',fn2,false):默认false,表示冒泡 true:捕获 \ No newline at end of file -- Gitee From 922577f5b4d986d6adbb40d7e89524db85fa2b1c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=AD=A4=E4=B8=9C?= <3352403143@qq.com> Date: Fri, 25 Nov 2022 12:46:32 +0800 Subject: [PATCH 2/5] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../2022.11.25/1.html" | 29 ++++++++++++++++++ .../2022.11.25/2.html" | 30 +++++++++++++++++++ ...13\344\273\266\345\257\271\350\261\241.md" | 18 +++++++++++ 3 files changed, 77 insertions(+) create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25/1.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25/2.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25/\344\272\213\344\273\266\345\257\271\350\261\241.md" diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25/1.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/1.html" new file mode 100644 index 0000000..310f961 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/1.html" @@ -0,0 +1,29 @@ + + + + + + + Document + + + + + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25/2.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/2.html" new file mode 100644 index 0000000..f3f04f7 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/2.html" @@ -0,0 +1,30 @@ + + + + + + + Document + + +
+ banana + apple + orange +

+
+ + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25/\344\272\213\344\273\266\345\257\271\350\261\241.md" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/\344\272\213\344\273\266\345\257\271\350\261\241.md" new file mode 100644 index 0000000..091a04c --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25/\344\272\213\344\273\266\345\257\271\350\261\241.md" @@ -0,0 +1,18 @@ +# 事件对象 + +event 对象代表事件的状态 + +表示事件发生后,跟事件有关的一系列信息数据的集合都放到整个对象里面,这个对象就是事件对象event,它有很多属性和方法。 + +事件对象产生时间:当有事件触发的时候,会自动生成事件对象 + + 事件源对象:触发该事件的对象 + +###### target + +e.target: 返回触发事件的对象(标准) + +#### 取消冒泡的2种方法 + + e.stopPropagation() + e.cancelBubble = true; \ No newline at end of file -- Gitee From 70c61c7474dfc7b568836dd23412bf3ffd74113e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=AD=A4=E4=B8=9C?= <3352403143@qq.com> Date: Mon, 28 Nov 2022 11:56:35 +0800 Subject: [PATCH 3/5] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../2022.11.25 \344\270\213/1.html" | 24 +++++++++++ .../2022.11.25 \344\270\213/2.html" | 41 +++++++++++++++++++ .../2022.11.25 \344\270\213/JQuery.md" | 27 ++++++++++++ 3 files changed, 92 insertions(+) create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/1.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/2.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/JQuery.md" diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/1.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/1.html" new file mode 100644 index 0000000..27f0e98 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/1.html" @@ -0,0 +1,24 @@ + + + + + + + Document + + + + + + + + + + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/2.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/2.html" new file mode 100644 index 0000000..df67bbe --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/2.html" @@ -0,0 +1,41 @@ + + + + + + + Document + + + + + + + + + + + + + + + + + + + + + +
第一行第一行
第二行第二行
第三行第三行
第四行第四行
第五行第五行
+ + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/JQuery.md" "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/JQuery.md" new file mode 100644 index 0000000..3535d0e --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.25 \344\270\213/JQuery.md" @@ -0,0 +1,27 @@ +# JQuery + +JQuery是一个前端的js库,他封装了一些原生的操作的方法以及解决一些原生的兼容。 + +通过JQuery对象来调用,可以使用$代替JQuery + +```js +console.log($('名')); +``` + +###### 选择器 + +```js +$("标签名") +id选择器:#id +元素名称(标签)选择器:标签 +类选择器:.名 +选择所有元素:* +``` + + + +###### 事件: + +click:单击事件 + +dbclick: \ No newline at end of file -- Gitee From 87480fe3a4a5456044ef6dec33247f66763790a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=AD=A4=E4=B8=9C?= <3352403143@qq.com> Date: Tue, 29 Nov 2022 22:08:37 +0800 Subject: [PATCH 4/5] =?UTF-8?q?=E5=81=9A=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...\346\234\237\346\234\253\350\200\203.html" | 291 ++++++++++++++++++ .../2022.11.28/jQuery.md" | 45 +++ 2 files changed, 336 insertions(+) create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.28/2022_2021_20\347\272\247js\346\234\237\346\234\253\350\200\203.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.28/jQuery.md" diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.28/2022_2021_20\347\272\247js\346\234\237\346\234\253\350\200\203.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.28/2022_2021_20\347\272\247js\346\234\237\346\234\253\350\200\203.html" new file mode 100644 index 0000000..de81ae7 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.28/2022_2021_20\347\272\247js\346\234\237\346\234\253\350\200\203.html" @@ -0,0 +1,291 @@ + + + + + + + + Document + + + + + + + + + + + + + + + + + + +
留言 0
+ +
+ + + + + + + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.28/jQuery.md" "b/33\347\275\227\346\255\244\344\270\234/2022.11.28/jQuery.md" new file mode 100644 index 0000000..8029634 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.28/jQuery.md" @@ -0,0 +1,45 @@ +# jQuery + +##### 属性 + +###### arrt: + +attr('属性名称') 获取指定的属性值,操作checkbox时选中返回checked,没有选中返回undefined。attr('checked') + +###### prop: + +prop('属性名称') 获取具有true和false两个属性的属性值prop('checked') + +固有属性: + +返回值是bool的属性: checked ,selected, disabled + + + +##### 元素的增删改查 + +1.在目标元素添加子元素:$('目标元素').prepend($子元素); + +1.1添加子元素到目标元素: $子元素.prependTo($('目标元素')); + +1.2添加子元素到目标元素:$子元素.appendTo($('目标元素')); + +1.3添加同级元素: + +在目标元素前插入新元素:$('目标元素').after($新元素); + +在目标元素后插入新元素:$('目标元素').before($新元素); + + + +2.删除整个元素:$('属性名').remove(); + +2.1删除选择属性的子元素,自身会保留:$('属性名').empty(); + +##### each + +遍历元素 + +$(selector).each(function(index,element)) + +其中element ==this 为当前元素 \ No newline at end of file -- Gitee From 95a2d62584ef944f1d031803cb78c075c76382e9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=AD=A4=E4=B8=9C?= <3352403143@qq.com> Date: Thu, 1 Dec 2022 12:13:59 +0800 Subject: [PATCH 5/5] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...\345\215\225\351\252\214\350\257\201.html" | 121 ++++++++++++++++++ .../2022.11.30/JQuery.md" | 61 +++++++++ 2 files changed, 182 insertions(+) create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.30/2022_1130_\350\241\250\345\215\225\351\252\214\350\257\201.html" create mode 100644 "33\347\275\227\346\255\244\344\270\234/2022.11.30/JQuery.md" diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.30/2022_1130_\350\241\250\345\215\225\351\252\214\350\257\201.html" "b/33\347\275\227\346\255\244\344\270\234/2022.11.30/2022_1130_\350\241\250\345\215\225\351\252\214\350\257\201.html" new file mode 100644 index 0000000..d3d4ea3 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.30/2022_1130_\350\241\250\345\215\225\351\252\214\350\257\201.html" @@ -0,0 +1,121 @@ + + + + + 注册表单验证 + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
用户注册
用户名: + +
密码: + +
密码确认: + +
性别: + 男 + 女 + +
专业: + + +
爱好: + 抽烟 + 喝酒 + 打游戏 + 烫头发 + 足球 + 篮球 + +
自我介绍: + +
  + + +
+ +
+ + + \ No newline at end of file diff --git "a/33\347\275\227\346\255\244\344\270\234/2022.11.30/JQuery.md" "b/33\347\275\227\346\255\244\344\270\234/2022.11.30/JQuery.md" new file mode 100644 index 0000000..0b01d80 --- /dev/null +++ "b/33\347\275\227\346\255\244\344\270\234/2022.11.30/JQuery.md" @@ -0,0 +1,61 @@ +# JQuery + +#### 事件对象 + +事件对象什么时候产生:触发事件的时候 this + +###### 事件绑定 + +1.直接绑定 + +2.事件的链式调用,为一个对象绑定多个事件 + +```js + $('button').mouseover( + function () { + $(this).css('color','red'); + } + ).mouseout( + function () { + $(this).css('color','black'); + } + ).click( + function () { + console.log('click'); + } + ) +``` + +3.bind():可以为多个事件绑定同一个函数 + +```js +$('button').bind('click ',function () { + console.log('这是bind'); + }) +``` + +4.on():绑定 + + on可以为动态添加的元素进行事件绑定 + +```js + $('.newdiv').click(function () { + var $btn = $(''); + $(this).append($btn); + console.log('这是在div中'); + }) + + $(document).on('click','button',function () { + console.log('这是新创建的元素'); + }) +``` + +5.one:只触发一次事件 + + 最后一个-1 倒数第二个-2 + + $('button').eq(-1).one('click',function () { + +​ alert('一次事件'); + + }) \ No newline at end of file -- Gitee