JS 工具函数

// var tools = function() {
  function addEvent(el, type, fn) {
    if (el.addEventListener) { //
      el.addEventListener(type, fn, false);
    } else if (el.attachEvent) {
      el.attachEvent(‘on‘ + type, fn);
    } else {
      el[‘on‘ + type] = fn;
    }
  }

  function getStyles(elem, prop) {
    if (window.getComputedStyle) {
      if (prop) {
        return parseInt(window.getComputedStyle(elem)[prop]);
      } else {
        return window.getComputedStyle;
      }
    } else if (elem.currentStyle) {
      if (prop) {
        return elem.currentStyle[prop]
      } else {
        return elem.currentStyle;
      }

    }
  }

  function getEleDocPosition(ele) {
    var parent = ele.offsetParent,
      offsetLeft = ele.offsetLeft,
      offsetTop = ele.offsetTop;
    while (parent) {
      offsetLeft += parent.offsetLeft;
      offsetTop += parent.offsetTop;
      parent = parent.offsetParent;
    }

    return {
      left: offsetLeft,
      top: offsetTop
    }
  }

  function getScrollSize() {
    if (document.body.scrollHeight) {
      return {
        width: document.body.scrollWidth,
        height: document.body.scrollHeight
      };
    } else {
      return {
        width: document.documentElement.scrollWidth,
        height: document.documentElement.scrollHeight
      }
    }
  }

  function getViewportSize() {
    if (window.innerWidth) {
      return {
        width: window.innerWidth,
        height: window.innerHeight
      }
    } else {
      if (document.compatMode === ‘BackCompat‘) {
        return {
          width: document.body.clientWidth,
          height: document.body.clientHeight
        }
      } else if (document.compatMode === ‘CSS1Compat‘) {
        return {
          width: document.documentElement.clientWidth,
          height: document.documentElement.clientHeight
        }
      }
    }
  }

  function getScrollOffset() {
    if (window.pageXOffset) { // w3c 规范
      return {
        left: window.pageXOffset,
        top: window.pageYOffset
      }
    } else {
      return {
        left: document.body.scrollLeft + document.documentElement.scrollLeft, //document.body.scrollLeft 和 document.documentElement.scrollLeft都是数字类型,不存在即为0
        top: document.body.scrollTop + document.documentElement.scrollTop,
      }
    }
  }

  function elemChildren(node) {
    var temp = {
      ‘length‘: 0,
      ‘push‘: Array.prototype.push,
      ‘splice‘: Array.prototype.splice
    },
        children = node.childNodes;
    for (var i = 0; i < children.length; i++) {
      var childItem = children[i];

      if (childItem.nodeType === 1) {
        // temp[temp[‘length‘]] = childItem;
        // temp[‘length‘]++;
        temp.push(childItem);
      }
    }
    return temp;
  }

  function cancelBuble(e) {
    if (e.stopPropagation) {
      e.stopPropagation();
    } else {
      e.cancelBuble = true;
    }
  }

//   return {
//     addEvent: addEvent,
//     getStyles: getStyles,
//     getEleDocPosition: getEleDocPosition,
//     getScrollWidth: getScrollWidth,
//     getViewportSize: getViewportSize,
//     getScrollOffset: getScrollOffset,
//     elemChildren: elemChildren,
//     cancelBuble: cancelBuble
//   }
// };

原文地址:https://www.cnblogs.com/ycherry/p/12106189.html

时间: 2024-11-06 11:37:08

JS 工具函数的相关文章

封装一些常用的js工具函数-不定时更新(希望大家积极留言,反馈bug^_^)

/*华丽----------------------------------------------------------------------------------------------------------------------------------分割线*///获取元素样式// 获取的是计算机计算后的样式// 单一样式不能拿来判断// 复合样式的获取有兼容性问题// 可以使用如backgroundColor的属性// 不要有空格// 不要获取为设置的样式:不兼容// func

JS工具函数汇总

备注:http://phpjs.org/  这个站点把PHP常用的方法用js实现了,推荐一下 1.从数组中随机获取几个不重复项 //从一个给定的数组arr中,随机返回num个不重复项 function getArrayItems(arr, num) { //新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组; var temp_array = new Array(); for (var index in arr) { temp_array.push(arr[index]);

js工具函数

checkVersion.js(检查浏览器类型)function checkVersion(){ var u = navigator.userAgent, app = navigator.appVersion; return { trident: u.indexOf('Trident') > -1, //IE内核 presto: u.indexOf('Presto') > -1, //opera内核 webKit: u.indexOf('AppleWebKit') > -1, //苹果.

js常用工具函数大全

项目中经常会用到的js工具函数,待更新: 小于10补0,常用于日期月份补0: // 小于10补0 function format(n) { return n.toString().replace(/^(\d)$/, '0$1'); } 千分位显示,常用于价格显示: // 千分位 function toThousands(num) { return parseFloat(num).toFixed(2).replace(/(\d{1,3})(?=(\d{3})+(?:\.))/g, "$1,&quo

工具函数之JS

1. 判断元素是否有滚动条 1 /* 2 1. 浏览器在没有滚动条的时候,scrollLeft/scrollTop赋值后不会发生变化,始终是0: 3 2. scrollLeft,scrollTop为负数值时会报错 4 */ 5 var scroll = function (elm) { 6 var elms = elm ? [elm] : [document.documentElement, document.body], 7 scrollX = false, 8 scrollY = false

工具函数(一)

工具函数是指直接依附于jQuery对象,针对jQuery对象本身定义的方法,即全局性的函数.它的作用主要是提供比如字符串.数组.对象等操作方面的遍历. 字符串操作 在jQuery中,字符串的工具函数只有一个,就是去除字符串左右空格的工具函数:$.trim().如: var str = " jQuery "; alert(str); alert($.trim(str)); 数组和对象操作 jQuery为处理数组和对象提供了一些工具函数, 这些函数可以便利的给数组或对象进行遍历.筛选.搜索

工具函数(二)

测试操作 在jQuery中,数据有着各种类型和状态.有时,我们希望能通过判断数据的类型和状态做相应的操作.jQuery提供了五组测试用的工具函数. 测试工具函数 函数名 说明 $.isArray(obj) 判断是否为数组对象,是返回true $.isFunction(obj) 判断是否为函数,是返回true $.isEmptyObject(obj) 判断是否为空对象,是返回true $.isPlainObject(obj) 判断是否为纯粹对象,是返回true $.contains(obj) 判断

jquery 源码学习(四)构造jQuery对象-工具函数

jQuery源码分析-03构造jQuery对象-工具函数,需要的朋友可以参考下. 作者:nuysoft/高云 QQ:47214707 EMail:[email protected] 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. 读读写写,不对的地方请告诉我,多多交流共同进步,本章的的PDF等本章写完了发布. jQuery源码分析系列的目录请查看 http://nuysoft.iteye.com/blog/1177451,想系统的好好写写,目前还是从我感兴趣的部分开始,如果大家有对哪

JQuery中的工具函数总结

前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> 工具方法 ①获取浏览器的名称与版本信息 在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息,如$.browser.chrome为true,表示当前为Chrome浏览器,$.browser.