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 0000000000000000000000000000000000000000..35a9c362e79f13fdc9f1ce7ecda1a76b98926b9a --- /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 0000000000000000000000000000000000000000..5b4bd8fb11f01f98c045bb861db316fc1141ac16 --- /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 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 0000000000000000000000000000000000000000..27f0e986930f72874f42a23d5c7838030462cb95 --- /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 0000000000000000000000000000000000000000..df67bbeaeab017cc3a7d5bfc6c8b44bbe14d6a4c --- /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 0000000000000000000000000000000000000000..3535d0e687a960078c3ec032a0852a409a34dfe1 --- /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 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 0000000000000000000000000000000000000000..310f9616a88e794c97d64f4abc78bee11da4312a --- /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 0000000000000000000000000000000000000000..f3f04f72514d3bb6600527c8d369d0d0f1df8ea7 --- /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 0000000000000000000000000000000000000000..091a04cc6dfe5dd7ae36215fd62465d83713af67 --- /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 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 0000000000000000000000000000000000000000..de81ae7bb476a8ab57696eab33c02ad73d0c7b94 --- /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 0000000000000000000000000000000000000000..80296347a02154fc725c28b832fd0a2a8d2c9a76 --- /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 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 0000000000000000000000000000000000000000..d3d4ea3376f9820be201ba5064f1b0332c11e302 --- /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 0000000000000000000000000000000000000000..0b01d80a1ef5bfecdd710f45847b8d02c54b8977 --- /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