2021年9月6日

js基础---拖拽元素(封装成方法)

摘要： window.onload = function () { var box1 = document.getElementById("box1"); drag(box1); }; /** * 专门用来拖拽的方法，参数为拖拽元素的ID */ function drag(obj) { //当鼠标在被拖拽元阅读全文

posted @ 2021-09-06 08:19 leiyanting 阅读(93) 评论(0) 推荐(0)

js基础---事件的传播 addEventListener()的第三个参数设置为true

摘要： * 事件的传播 * - 关于事件的传播网景公司和微软公司有不同的理解 * - 微软公司认为事件应该是由内向外传播，也就是当事件触发时，应该先触发当前元素上的事件， * 然后再向当前元素的祖先元素上传播，也就说事件应该在冒泡阶段执行。 * - 网景公司认为事件应该是由外向内传播的，也就是当前事件触发时阅读全文

posted @ 2021-09-06 07:20 leiyanting 阅读(233) 评论(0) 推荐(0)

2021年9月5日

js基础---事件的委派

摘要： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> window.onload = function(){ var u1 = document.g 阅读全文

posted @ 2021-09-05 20:27 leiyanting 阅读(100) 评论(0) 推荐(0)

js基础---事件的绑定(绑定多个相同事件 addEventListener / attachEvent)

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> window.onload = function(){ /* * 点击按钮以后弹出一个内容 */ 阅读全文

posted @ 2021-09-05 20:12 leiyanting 阅读(1458) 评论(0) 推荐(0)

js基础---事件的冒泡

摘要： - 事件的冒泡（Bubble） - 事件的冒泡指的是事件向上传导，当后代元素上的事件被触发时，将会导致其祖先元素上的同类事件也会触发。 - 事件的冒泡大部分情况下都是有益的，如果需要取消冒泡，则需要使用事件对象来取消 - 可以将事件对象的cancelBubble设置为true，即可取消冒泡 - 例子阅读全文

posted @ 2021-09-05 19:08 leiyanting 阅读(170) 评论(0) 推荐(0)

js基础---div跟随鼠标移动练习

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box1{ width: 100px; height: 100px; background-color: red 阅读全文

posted @ 2021-09-05 17:25 leiyanting 阅读(91) 评论(0) 推荐(0)

js基础---event事件对象解决IE8兼容性问题练习(1)

摘要： - 事件对象 - 当响应函数被调用时，浏览器每次都会将一个事件对象作为实参传递进响应函数中，这个事件对象中封装了当前事件的相关信息，比如：鼠标的坐标，键盘的按键，鼠标的按键，滚轮的方向。。 - 可以在响应函数中定义一个形参，来使用事件对象，但是在IE8以下浏览器中事件对象没有做完实参传递，而是作为阅读全文

posted @ 2021-09-05 16:24 leiyanting 阅读(215) 评论(0) 推荐(0)

js基础---判断滚动条是否滑动到底练习

摘要： window.onload = function(){ document.querySelector("p").onscroll = function(){ // 滑动的距离 var n = this.scrollTop; //2304 // 滑动元素的总高度 var v = this.scroll 阅读全文

posted @ 2021-09-05 15:29 leiyanting 阅读(124) 评论(0) 推荐(0)

js基础---其余的样式相关的属性/判断滚动条是否到底

摘要：注意：以下样式都是只读的元素.clientHeight - 元素的可见高度，指元素的内容区和内边距的高度元素.clientWidth - 元素的可见宽度，指元素的内容区和内边距的宽度元素.offsetHeight - 整个元素的高度，包括内容区、内边距、边框元素.offfsetWidth - 阅读全文

posted @ 2021-09-05 15:02 leiyanting 阅读(76) 评论(0) 推荐(0)

js基础---正常浏览器与IE获取元素的样式 getComputedStyle/元素.currentStyle

摘要： - 正常浏览器 - 使用getComputedStyle() - 这个方法是window对象的方法，可以返回一个对象，这个对象中保存着当前元素生效样式 - 参数： 1.要获取样式的元素 2.可以传递一个伪元素，一般传null - 例子：获取元素的宽度 getComputedStyle(box , 阅读全文

posted @ 2021-09-05 14:12 leiyanting 阅读(119) 评论(0) 推荐(0)

导航

2021年9月6日

2021年9月5日