推荐4个原生javascript常用的函数


Posted in Javascript onJanuary 12, 2015

【一】添加监听事件

     addHandler:function(node,type,fn){if(node.addEventListener){

                node.addEventListener(type,fn,false);  // false,设置为冒泡事件

            }

            else{

                node.attachEvent('on'+type,function(){

                    fn.apply(node,arguments); // attachEvent方法中,this并不是指向node,所以需要用apply()方法改变

                });

            }

     }

 【二】设置元素的样式

       setCss:function(node,val){   // val:{'top':'2px','font-size':'12px'}

            for(var v in val){ 

                node.style.cssText += ';'+ v +':'+val[v];  //使用 cssText就可以同时设置多个属性,还有个好处可以避免 cssFloat,styleFloat的判断

            }

        }

【三】获取CSS类名元素

 //parent是可选参数,

      getByClassName:function(className,parent){

            var elem = [],

                node = parent != undefined&&parent.nodeType==1?parent.getElementsByTagName('*'):document.getElementsByTagName('*'),

                p = new RegExp("(^|\\s)"+className+"(\\s|$)");

            for(var n=0,i=node.length;n<i;n++){

                if(p.test(node[n].className)){

                    elem.push(node[n]);

                }

            }

            return elem;

        }

 【四】删除CSS类名

removeClassName:function(node,className){

    var par = new RegExp(className,'g');

    node.className = node.className.replace(par,'');

}

以上4个就是本人整理的非常实用也需要经常使用到的原生js函数,推荐给小伙伴们,希望对大家有所帮助。

Javascript 相关文章推荐
checkbox勾选判断代码分析
Jun 11 Javascript
javascript基本类型详解
Nov 28 Javascript
Javascript中arguments和arguments.callee的区别浅析
Apr 24 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
Sep 12 Javascript
jquery+ajax实现注册实时验证实例详解
Dec 08 Javascript
学习JavaScript设计模式之策略模式
Jan 12 Javascript
JavaScript学习总结之JS、AJAX应用
Jan 29 Javascript
vue.js入门(3)——详解组件通信
Dec 02 Javascript
JavaScript满天星导航栏实现方法
Mar 08 Javascript
JS 数组随机洗牌的实例代码
Sep 12 Javascript
详解Vue中组件的缓存
Apr 20 Javascript
用Golang运行JavaScript的实现示例
Nov 25 Javascript
原生js实现日期联动
Jan 12 #Javascript
Javascript中innerHTML用法实例分析
Jan 12 #Javascript
js实现从数组里随机获取元素
Jan 12 #Javascript
javascript的tab切换原理与效果实现方法
Jan 10 #Javascript
js中的事件捕捉模型与冒泡模型实例分析
Jan 10 #Javascript
js中键盘事件实例简析
Jan 10 #Javascript
js中this的用法实例分析
Jan 10 #Javascript
You might like
PHP测试程序运行时间的类
2012/02/05 PHP
PHP 9 大缓存技术总结
2015/09/17 PHP
PHP中overload与override的区别
2017/02/13 PHP
PHP仿tp实现mvc框架基本设计思路与实现方法分析
2018/05/23 PHP
php的命名空间与自动加载实现方法
2019/08/25 PHP
如何做到打开一个页面,过几分钟自动转到另一页面
2007/04/20 Javascript
Jquery AutoComplete自动完成 的使用方法实例
2010/03/19 Javascript
js的2种继承方式详解
2014/03/04 Javascript
js实现获取焦点后光标在字符串后
2014/09/17 Javascript
TypeError document.getElementById(...) is null错误原因
2015/05/18 Javascript
深入浅析search 搜索框的写法
2016/08/02 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
2016/08/02 Javascript
JavaScript实战之菜单特效
2016/08/16 Javascript
JS实现动画兼容性的transition和transform实例分析
2016/12/13 Javascript
浅析上传头像示例及其注意事项
2016/12/14 Javascript
JQuery中Ajax的操作完整例子
2017/03/07 Javascript
nodejs+express实现文件上传下载管理网站
2017/03/15 NodeJs
jQuery自定义元素右键点击事件(实现案例)
2017/04/28 jQuery
利用jquery去掉时光轴头尾部线条的方法实例
2017/06/16 jQuery
基于 flexible 的 Vue 组件:Toast -- 显示框效果
2017/12/26 Javascript
express启用https使用小记
2019/05/21 Javascript
浅谈Python的垃圾回收机制
2016/12/17 Python
python实现任意位置文件分割的实例
2018/12/14 Python
详解python 3.6 安装json 模块(simplejson)
2019/04/02 Python
python将图片转base64,实现前端显示
2020/01/09 Python
树莓派升级python的具体步骤
2020/07/05 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
台湾SHOPRO购物行家:亚洲首创影视.3C.家电.优质购物平台
2018/05/07 全球购物
英国假睫毛购买网站:FalseEyelashes.co.uk
2018/05/23 全球购物
全球异乡人的跨境社交电商平台:Kouhigh口嗨网
2020/07/24 全球购物
优秀志愿者事迹材料
2014/02/03 职场文书
奥巴马获胜演讲稿
2014/05/15 职场文书
给朋友的道歉短信
2015/05/12 职场文书
催款律师函范文
2015/05/27 职场文书
发言稿之优秀教师篇
2019/09/26 职场文书
MySQL如何快速创建800w条测试数据表
2022/03/17 MySQL