确定有人会说,添加类名能够用obj.classList.add
呀,是的,这没有错。但我也说了,这些我积累的函数都是兼容性极佳的方式,也就是说,无论是 ie 的多低版本,也是没多大问题的,并且这些本身实现的功能确实对初学者帮助很多。chrome
function addClass(ele, className){ var reg = new RegExp("\\b"+className+"\\b"); if(!reg.test(ele.className)){ /* 若是元素 ele 不包含 className */ ele.className += " "+className; }; }; function removeClass(ele, className){ if(ele.className){ var reg = new RegExp("\\b"+className+"\\b"); var classes = ele.className; ele.className = classes.replace(reg, ""); if(/^\s*$/g.test(ele.className)){ ele.removeAttribute("class"); }; }else{ ele.removeAttribute("class"); } };
2.滚轮事件函数
滚轮事件也是 PC 端主流网站必须实现的功能,一般咱们会配合咱们本身写的滚动条禁止掉系统的滚动条来使用。可是,滚轮事件跟咱们想象的略有不一样,它是 firefox 一种绑定,反而 ie 和 chrome 是同样的。网站
window.onload = function () {firefox
//ie/chrome document.onmousewheel = function(event){ scrollMove(event,callback) } //firefox if(document.addEventListener){ document.addEventListener('DOMMouseScroll',function(event){ scrollMove(event,callback) }); } function scrollMove(event,callback) { event = event || window.event; var flag = ''; if(event.wheelDelta){ //ie/chrome if(event.wheelDelta > 0){ //上 flag = 'up'; }else { //下 flag = 'down' } }else if(event.detail){ //firefox if(event.detail < 0){ //上 flag = 'up'; }else { //下 flag = 'down' } } switch (flag){ case 'up': if (callback && callback['wheelUp'] == 'function') { callback.wheelUp() } break; case 'down': break; } //取消默认行为 event.preventDefault && event.preventDefault(); return false; } };
未完待续 , 有时间就更新