![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
文章平均质量分 57
GofAnderson
这个作者很懒,什么都没留下…
展开
-
js事件对象&事件委托
事件对象事件源对象兼容写法事件委托事件委托事件对象var div = document.getElementsByTagName('div')[0];div.onclick = function (e) { // chrome的事件对象用 e 就可以 var event = e || window.event; //但是IE上没有 e ;IE 的事...原创 2018-04-04 15:27:10 · 286 阅读 · 0 评论 -
js拖拽功能
<div style="width: 100px; height:100px; background-color:red; position: absolute; left:0; top:0;"></div><script> var div = document.getElementsByTagName('div')[0]; var disX...原创 2018-04-04 16:05:07 · 234 阅读 · 0 评论 -
js事件分类
鼠标事件移动端键盘事件文本类操作事件窗体操作类(window上的事件)fixed定位,兼容IE6鼠标事件 click、mousedown、mousemove、mouseup、contextmenu、mouseover、mouseout、 mouseenter mouseleaveclick = mousedown + mouseup触发顺...原创 2018-04-04 20:29:03 · 219 阅读 · 0 评论 -
js运动
匀速运动小练习;页面滑出插件getStyle函数应用改变多个对象宽度通过startMove让元素的多个属性同时发生变化重点:多物体、多值、链式调用框架运动的本质——>物体的状态发生连续性的变化匀速运动<divstyle="height:100px; width:100px; background: orange; position:...原创 2018-04-05 15:53:14 · 251 阅读 · 0 评论 -
js运动(二)
弹性运动菜单栏应用模拟重力场碰撞检测模拟重力场带摩擦力模拟拖拽运动弹性运动方块在竖线左右来回运动<div style="width:100px; height:100px; background:orange; position: absolute; left:0; top:0;"></div><span s...原创 2018-04-06 13:38:44 · 245 阅读 · 0 评论 -
js运动(轮播图)
轮播图轮播图生成器轮播图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ini原创 2018-04-06 15:33:46 · 344 阅读 · 1 评论 -
js事件绑定
1.ele.onxxx = function (event) {}2.ele.addEventListener(type, fn, false);3.ele.attachEvent(‘on’ + type, fn);小练习1.ele.onxxx = function (event) {}兼容性很好,但是一个元素只能绑定一个处理程序var div = document...原创 2018-04-03 14:30:01 · 228 阅读 · 0 评论 -
js事件处理程序的运行环境(改变attachEvent内部的this指向&封装兼容性的 addEvent方法)
改变attachEvent内部的this指向封装兼容性的 addEvent(elem, type, handle);方法<div style="width:100px; height:100px; background-color:red"></div><script> var div = document.getElemen...原创 2018-04-03 15:13:48 · 900 阅读 · 0 评论 -
js解除事件处理程序
ele.onclick = false/‘’/null;ele.removeEventListener(type, fn, false);ele.detachEvent(‘on’ + type, fn);ele.onclick = false/‘’/null;<div style="width:100px; height:100px; background-...原创 2018-04-03 15:43:10 · 357 阅读 · 0 评论 -
js事件处理模型——事件冒泡、捕获
事件冒泡:事件捕获:其他形式的捕获取消冒泡封装取消冒泡的函数 stopBubble(event)阻止默认事件:封装阻止默认事件的函数 cancelHandler(event);事件冒泡:结构上(非视觉上)嵌套关系的元素,会存在事件冒泡的功能,即同一事件,自子元素冒泡向父元素。(自底向上)<div class="wrapper">...原创 2018-04-03 17:02:47 · 336 阅读 · 0 评论 -
tool.js
1.封装兼容性的 addEvent(elem, type, handle);方法2.封装取消冒泡的函数 stopBubble(event)3.封装阻止默认事件的函数 cancelHandler(event);获取样式getStyle多物体、多值、链式调用框架1.封装兼容性的 addEvent(elem, type, handle);方法functio...原创 2018-04-05 16:02:33 · 2148 阅读 · 0 评论 -
offsetLeft和style.left的区别
offsetLeft总的来说是获取当前元素距父元素左侧的值 ,具体分两种情况:如果当前元素仍在普通流中(即position值为static或者relative),offsetLeft获取的是当前元素距流中父元素左侧的值,包括父元素的padding-left、margin-left、border-left,注:IE下有误差; 如果当前元素已从普通流中删除,使用了绝对定位absolute或固...转载 2018-04-26 09:19:28 · 1040 阅读 · 0 评论