找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 1552|回复: 0

[教程] 一些常用且实用的原生JavaScript函数

[复制链接]
发表于 2013-3-27 14:58:37 | 显示全部楼层 |阅读模式 来自 中国–广东–湛江
csshtml方面的技巧总结,点此前往: 前端开发中一些常用技巧总结, 你还可以前往兰芝博客, 查看由淘宝UED整理的前端tips:
  1. document.getElementById的简写
  2. getElementsByTagName的简写方式
  3. 原生JavaScript中获取元素索引的函数
  4. 替代window.onload,可多次调用的加载函数:
  
  • function iLoad(func) {    var oLoad=window.onload;    if(typeof window.onload!='function'){        window.onload=func;    }else{        window.onload=function(){            oLoad();            func();        }    }}

复制代码



  5. 获取下一个元素节点:
  
  • function nextElem(node){    if(node.nodeType==1) return node;    if(node.nextSibling) return nextElem(node.nextSibling);    return null;}





  6. 获取上一个元素节点(此函数须调用第五条中的函数):
  
  • function prevElem(node){    if(node.nodeType==1){        return node;    }else if(node.previousSibling){        return nextElem(node.previousSibling);    }else{    return null;    }}





  7. 原生JavaScript中有insertBefore方法,可惜却没有insertAfter方法,怎么办?用如下函数实现:
  
  • function insertAfter(newChild,refChild){    var parElem=refChild.parentNode;    if(parElem.lastChild==refChild){        refChild.appendChild(newChild);    }else{        parElem.insertBefore(newChild,refChild.nextSibling);    }}





  8. 为元素添加样式[记住是添加不是替换,相当于jQuery中的addClass(value)]:
  
  • function addClass(elem,value){    if(!elem.className){        elem.className=value;    }else{        var oValue=elem.className;        oValue+=" ";        oValue+=value;        elem.className=oValue;    }}





  9. 获取元素的样式:
  
  • function getStyle(id,stylename){    var elem=$(id);    var realStyle=null;    if(elem.currentStyle){        realStyle=elem.currentStyle[stylename];    }else if(window.getComputedStyle){        realStyle=window.getComputedStyle(elem,null)[stylename];    }    return realStyle;}





  10. 兼容事件绑定:
  
  • function addEventSamp(obj,evt,fn){    if (obj.addEventListener) {        obj.addEventListener(evt, fn, false);    }else if(obj.attachEvent){        obj.attachEvent('on'+evt,fn);    }}





  11. 移除事件:
  
  • function removeEventSamp(obj,evt,fn){    if(obj.removeEventListener){        obj.removeEventListener(evt,fn,false);    }else if(obj.detachEvent){        obj.detachEvent('on'+evt,fn);    }}





  12. 检测样式:
  
  • function hasClass(element, className){    var reg = new RegExp('(\s|^)' + className + '(\s|$)');    return element.className.match(reg);}





  13. 删除样式:
  
  • function removeClass(element, className){    if (hasClass(element, className)) {        var reg = new RegExp('(\s|^)' + className + '(\s|$)');        element.className = element.className.replace(reg, ' ');    }}



评分

参与人数 1金币 -10 收起 理由
猫性男孩 -10 悄悄的告诉你,复制链接真的无链接

查看全部评分

发帖求助前要善用【论坛搜索】功能,那里可能会有你要找的答案;

如何回报帮助你解决问题的坛友,好办法就是点击帖子下方的评分按钮给对方加【金币】不会扣除自己的积分,做一个热心并受欢迎的人!

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则 需要先绑定手机号

关闭

站长推荐上一条 /1 下一条

QQ|侵权投诉|广告报价|手机版|小黑屋|西部数码代理|飘仙建站论坛 ( 豫ICP备2022021143号-1 )

GMT+8, 2024-11-3 00:33 , Processed in 0.032454 second(s), 9 queries , Redis On.

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表