推荐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代码)
Oct 29 Javascript
PHP 与 js的通信(via ajax,json)
Nov 16 Javascript
js+html+css实现鼠标移动div实例
Jan 30 Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
Sep 27 Javascript
js+css实现回到顶部按钮(back to top)
Mar 02 Javascript
jQuery实现字符串全部替换的方法
Dec 12 Javascript
Javascript之图片的延迟加载的实例详解
Jul 24 Javascript
轻松玩转BootstrapTable(后端使用SpringMVC+Hibernate)
Sep 06 Javascript
JavaScript常用数学函数用法示例
May 14 Javascript
微信小程序中button去除默认的边框实例代码
Aug 01 Javascript
Vue.js实现立体计算器
Feb 22 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 等比例缩放图片详解及实例代码
2016/09/18 PHP
javascript innerHTML使用分析
2010/12/03 Javascript
基于jquery跨浏览器显示的file上传控件
2011/10/24 Javascript
js遍历、动态的添加数据的小例子
2013/06/22 Javascript
使用javascript实现ListBox左右全选,单选,多选,全请
2013/11/07 Javascript
jquery 表格排序、实时搜索表格内容(附图)
2014/05/19 Javascript
jQuery实现瀑布流的取巧做法分享
2015/01/12 Javascript
js解决movebox移动问题
2016/03/29 Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
2017/08/17 Javascript
vue.js做一个简单的编辑菜谱功能
2018/05/08 Javascript
vue.js图片转Base64上传图片并预览的实现方法
2018/08/02 Javascript
详解Node.js中path模块的resolve()和join()方法的区别
2018/10/29 Javascript
记录一次完整的react hooks实践
2019/03/11 Javascript
layui自定义ajax左侧三级菜单
2019/07/26 Javascript
nest.js 使用express需要提供多个静态目录的操作方法
2019/10/24 Javascript
Vue 数组和对象更新,但是页面没有刷新的解决方式
2019/11/09 Javascript
使用node.JS中的url模块解析URL信息
2020/02/06 Javascript
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python切片知识解析
2016/03/06 Python
pycharm+django创建一个搜索网页实例代码
2018/01/24 Python
python 对dataframe下面的值进行大规模赋值方法
2018/06/09 Python
TensorFlow数据输入的方法示例
2018/06/19 Python
使用python验证代理ip是否可用的实现方法
2018/07/25 Python
Django web框架使用url path name详解
2019/04/29 Python
详解【python】str与json类型转换
2019/04/29 Python
Python多线程threading模块用法实例分析
2019/05/22 Python
wxpython绘制音频效果
2019/11/18 Python
瀑布模型都有哪些优缺点
2014/06/23 面试题
自动化专业毕业生自荐信
2013/11/01 职场文书
政法大学毕业生自荐信范文
2014/01/01 职场文书
超市国庆节促销方案
2014/02/20 职场文书
教育实习指导教师评语
2014/12/31 职场文书
教师节座谈会主持词
2015/07/03 职场文书
使用Html+Css实现简易导航栏功能(导航栏遇到鼠标切换背景颜色)
2021/04/07 HTML / CSS
Vue中foreach数组与js中遍历数组的写法说明
2021/06/05 Vue.js
PHP RabbitMQ消息列队
2022/05/11 PHP