diff --git "a/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022.11.24.html" "b/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022.11.24.html" new file mode 100644 index 0000000000000000000000000000000000000000..a78d2dc324c77b0c5a969d2e897a19e10228783d --- /dev/null +++ "b/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022.11.24.html" @@ -0,0 +1,39 @@ + + + + + + + + Document + + + +
+ 狗 + 猫 + 鼠 +
+

+ + + + \ No newline at end of file diff --git "a/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022_11_23js\347\254\254\344\272\214\345\215\201\346\254\241\344\275\234\344\270\232.html" "b/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022_11_23js\347\254\254\344\272\214\345\215\201\346\254\241\344\275\234\344\270\232.html" new file mode 100644 index 0000000000000000000000000000000000000000..a492f85ce5acc3b969a5cf9c2fe24f351a3ebcf4 --- /dev/null +++ "b/38\345\274\240\345\205\210\346\235\260/\344\275\234\344\270\232/2022_11_23js\347\254\254\344\272\214\345\215\201\346\254\241\344\275\234\344\270\232.html" @@ -0,0 +1,32 @@ + + + + + + + Document + + +
+ +
+ + + \ No newline at end of file diff --git "a/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/2022-11-24js\347\254\254\344\272\214\345\215\201\344\270\200\350\212\202\344\270\223\344\270\232\350\257\276\344\272\213\344\273\266(\344\270\213).md" "b/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/2022-11-24js\347\254\254\344\272\214\345\215\201\344\270\200\350\212\202\344\270\223\344\270\232\350\257\276\344\272\213\344\273\266(\344\270\213).md" new file mode 100644 index 0000000000000000000000000000000000000000..20dc191c370a0fd5a7d9279754cb7cea315e66bf --- /dev/null +++ "b/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/2022-11-24js\347\254\254\344\272\214\345\215\201\344\270\200\350\212\202\344\270\223\344\270\232\350\257\276\344\272\213\344\273\266(\344\270\213).md" @@ -0,0 +1,95 @@ +事件 + +#### 阻止默认行为 + +默认事件:表单提交,a标签跳转,右键菜单等 + +```js + +``` + +#### JS常用事件 + +###### 1.点击事件 + +onclick:单击事件 + +ondblclick:双击事件 + +###### 2.焦点事件 + +onblur:失去焦点 //单独使用 + +onfocus:元素获得焦点。//可以单独使用 + +###### 3.加载事件 + +onload:一张页面或一幅图像完成加载。 + +###### 4.鼠标事件 + +onmousedown: 鼠标按钮被按下。 + +onmouseup: 鼠标按键被松开。 + +onmousemove: 鼠标被移动。 + +onmouseover: 鼠标移到某元素之上。//和onmouseout成对使用 + +onmouseout :鼠标从某元素移开。 + +###### 5.键盘事件 + +onkeydown :某个键盘按键被按下。 + +onkeyup: 某个键盘按键被松开。 + +onkeypress :某个键盘按键被按下并松开。 + +###### 6.选择和改变 + +onchange :域的内容被改变。 + +onselect :文本被选中。 + +###### 7.表单事件 + +onsubmit :确认按钮被点击。 + +onreset: 重置按钮被点击 + + + +事件绑定 + +​ // var insideDiv = document.getElementById('inside'); + + //id: #id class: .calssname 标签: div + + // var insideDiv = document.querySelector('#inside')//id + + // var insideDiv = document.querySelector('.box')//class + +var insideDiv = document.querySelector('div div'); //获取第一个div子代的第一个div + + //根据标签名 + + // var insideDiv = document.getElementsByTagName('div')[1]; + +//阻止冒泡 + +​ //1. e.cancelBubble = true; + +​ //2. e.stopPropagation(); \ No newline at end of file diff --git "a/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/\344\272\213\344\273\266.md" "b/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/\344\272\213\344\273\266.md" new file mode 100644 index 0000000000000000000000000000000000000000..b8cefed4f8fcb435c16f1adffa8fd49620ef9f82 --- /dev/null +++ "b/38\345\274\240\345\205\210\346\235\260/\347\254\224\350\256\260/\344\272\213\344\273\266.md" @@ -0,0 +1,39 @@ +事件 + +DOM 0 + +当有多个同类型事件触发时,只会触发一个 ,兼容性较高 + +同类型会覆盖前面的 + + + +DOM 2 + +当有多个同类型事件触发时,会依次触发, 兼容性较差 + + + +事件流 + +//事件从最外层开始捕获,直到当前元素(触发事件的对象),再从当前元素向外冒泡到document + + 事件会自发冒泡(微软)(从里层向外层冒泡,直到document) + +事件冒泡就是从目标事件开始,把事件一点一点像父元素传递 + + 事件捕获(网景)(从最外层向里层) + +事件捕获就是从父元素流向目标元素 + +DOM2级事件"规定的事件流包括三个阶段:**事件捕获阶段**、**处于目标阶段**、**事件冒泡阶段**。 + + function fn1() { + +​ alert('这是最外层body里面的点击事件') + + } + + + +addEventListener('click',fn2,false):默认false,表示冒泡 true:捕获 \ No newline at end of file