推荐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 相关文章推荐
理解Javascript_02_理解undefined和null
Oct 11 Javascript
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
Jul 09 Javascript
javascript移出节点removeChild()使用介绍
Apr 03 Javascript
bootstrap改变按钮加载状态
Dec 01 Javascript
jQuery焦点图轮播特效代码分享(3款)
Sep 05 Javascript
jQuery在header中设置请求信息的方法
Mar 06 Javascript
JavaScript简单拖拽效果(1)
May 17 Javascript
JavaScript中正则表达式使数字、中文或指定字符高亮显示
Oct 31 Javascript
Angular2中监听数据更新的方法
Aug 31 Javascript
微信小程序实现搜索功能并跳转搜索结果页面
May 18 Javascript
vue路由守卫,限制前端页面访问权限的例子
Nov 11 Javascript
vue实践---vue不依赖外部资源实现简单多语操作
Sep 21 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
openflashchart 2.0 简单案例php版
2012/05/21 PHP
PHP 简易输出CSV表格文件的方法详解
2013/06/20 PHP
ThinkPHP写数组插入与获取最新插入数据ID实例
2014/11/03 PHP
thinkphp中memcache的用法实例
2014/11/29 PHP
Codeigniter通过SimpleXML将xml转换成对象的方法
2015/03/19 PHP
jQuery Tools Dateinput使用介绍
2012/07/14 Javascript
js 走马灯简单实例
2013/11/21 Javascript
node.js中的fs.readdir方法使用说明
2014/12/17 Javascript
JS替换字符串中空格方法
2015/04/17 Javascript
JavaScript包装对象使用详解
2015/07/09 Javascript
jQuery的deferred对象使用详解
2016/09/25 Javascript
JavaScript数据结构之二叉查找树的定义与表示方法
2017/04/12 Javascript
layui点击导航栏刷新tab页的示例代码
2018/08/14 Javascript
解决vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效问题
2018/08/24 Javascript
关于vue编译版本引入的问题的解决
2018/09/17 Javascript
JQuery中queue方法用法示例
2019/01/31 jQuery
javascript判断一个变量是数组还是对象
2019/04/10 Javascript
Python常用正则表达式符号浅析
2014/08/13 Python
Python中实现对Timestamp和Datetime及UTC时间之间的转换
2015/04/08 Python
win与linux系统中python requests 安装
2016/12/04 Python
Python 比较文本相似性的方法(difflib,Levenshtein)
2018/10/15 Python
python 处理微信对账单数据的实例代码
2019/07/19 Python
Django 自动生成api接口文档教程
2019/11/19 Python
Python 实现向word(docx)中输出
2020/02/13 Python
python发qq消息轰炸虐狗好友思路详解(完整代码)
2020/02/15 Python
python实现可下载音乐的音乐播放器
2020/02/25 Python
Django后端分离 使用element-ui文件上传方式
2020/07/12 Python
深入解析HTML5中的Blob对象的使用
2015/09/08 HTML / CSS
PHP面试题集
2016/12/18 面试题
运动会致辞稿50字
2014/02/04 职场文书
公司门卫岗位职责
2014/03/15 职场文书
房产委托公证书
2014/04/08 职场文书
党员演讲稿
2014/09/04 职场文书
小学教师2014年度工作总结
2014/12/03 职场文书
红与黑读书笔记
2015/06/29 职场文书
少先队中队工作总结2015
2015/07/23 职场文书