February19,2016个人博文--Migratetosegmentfault不太好记,整理如下。(当然,以后还会有更新。。。)示例代码如下:(1)阻止默认事件obj.onclick=function(ev){varevent=ev||window.event;如果(事件。预防默认){事件。防止默认();/*W3C标准*/}else{event.returnValue=false;/*兼容IE*/}}Tips:returnfalse;也可以防止默认事件但要注意位置。(2)获取下一个(上)兄弟节点functionnextnode(obj){/*获取下一个兄弟节点*/if(obj.nextElementSibling){returnobj.nextElementSibling;}else{返回obj.nextSibling;}}functionprenode(obj){/*获取前一个兄弟节点*/if(obj.previousElementSibling){returnobj.previousElementSibling;}else{返回obj.previousSibling;}}(3)获取第一个子(最后)节点函数firstnode(obj){/*获取第一个子节点*/if(obj.firstElementChild){returnobj.firstElementChild;/*IE678不支持*/}else{returnobj.firstChild;/*IE678支持*/}}functionlastnode(obj){/*获取最后一个子节点*/if(obj.lastElementChild){returnobj.lastElementChild;/*IE678不支持*/}else{returnobj.lastChild;/*IE678支持*/}}(4)添加(删除)事件监听函数addEvent(obj,type,fn){/*添加事件*/if(obj.addEventListener){obj.addEventListener(类型,fn,假);//为非IE添加事件监听器}else{obj.attachEvent('on'+type,fn);//IE添加事件绑定stopEvent();}}functionremoveEvent(obj,type,fn){//移除事件if(obj.removeEventListener){obj.removeEventListener(type,fn,false);//非IE移除事件,移除事件,第三个参数必须是函数名}else{obj.detachEvent('on'+type,fn);//IERemoveevent}}(5)Exampleclickevent防止事件传播obj.onclick=function(ev){varevent=ev||window.event;警报('aa');if(event.stopPropagation){event.stopPropagation();//非IE阻止事件传播}else{event.cancelBubble=true;//IE阻止事件传播}}(6)mouseover和mouseover事件委托(经常用到,用来解决当鼠标浮动到元素容器中时不同子元素之间存在闪烁的问题只需在函数的头部添加以下代码function(ev){})//mouseoverdelegationeventvarevent=ev||window.event;//varfrom=event.fromElement||event.relatedTarget;//inFrom在mouseover事件中表示鼠标来自于哪个元素,也是一种事件委托类型,与target和srcElement相反//alert(from);varfrom=event.fromElement||event.relatedTarget;while(from){如果(this==from){returnfalse;};from=from.parentNode;}//mouseout委托事件varevent=ev||window.event;varto=event.toElement||event.relatedTarget;//mouseout事件中的to,表示鼠标指向那个元素,也是事件委托类型,与target和srcElement相反//alert(to)while(to){if(this==to){return错误的;};to=to.parentNode;}(7)滚轮事件box.onmousewheel=function(ev){varevent=ev||window.event;//box.innerHTML='鼠标滚动'+event.wheelDelta;if(event.wheelDelta>0){alert('beforethemouseRoll');//非Firefoxroll-forward120}else{alert('Mouseroll-back')//非Firefoxroll-back-120};}*/box.addEventListener('DOMMouseScroll',function(ev){varevent=ev||window.event;alert(event.detail);//Firefoxrollforward:-3,rollback:3},false)//IE678不支持8.js按需加载异步加载demo.js如下functiontest(){console.log('hello');}index.html如下functionloadScript(url,callback){varscript=document.createElement('script');脚本。类型='文本/javascript';if(script.readyState){//即script.onreadystatechange=function(){if(script.readyState=='complete'||script.readyState=='loaded'){callback()}}}else{脚本。onload=function(){//Safarichromefirefoxopera----即脚本没有onload方法callback();}}script.src=url;//写在这里防止onreadystatechange状态不改变document.head.appendChild(script)}loadScript('demo.js',function(){test()})
