前端业务代码工具库 > 目的：高效率完成前端业务代码 业务开发过程中，会经常用到`日期格式化`、`url参数转对象`、`浏览器类型判断`、`节流函数`等常用函数，为避免不同项目多次复制粘贴的麻烦，这里统一封装，并发布到npm，以提高开发效率。如果你也有常用的代码，欢迎为本项目提交pr。 ## 安装使用 1. 直接下载`min`目录下的[toolsbox.min.js](https://github.com/hyy520/toolsbox/blob/master/min/toolsbox.min.js)使用，支持UMD通用模块规范 2. 使用npm安装 ### 浏览器: ``` html ``` ### npm: ``` bash $ npm install --save-dev common-tools-box ``` webpack、RequireJS、SeaJS等 ``` javascript // 完整引入 const toolsbox = require('common-tools-box') const OS = toolsbox.getOS() ``` **推荐使用方法** 你真的不需要完整引入所有函数，所以只引入需要使用的方法即可。 ``` javascript const getOS = require('common-tools-box') const OS = getOS() ``` 当然，你的开发环境有 babel编译 ES6语法的话，也可以这样使用： ``` javascript import getOS from 'common-tools-box/getOS' // 或 import { getOS } from "common-tools-box"; ``` ## API文档 ### Array ####   [arrayEqual][arrayEqual]  判断两个数组是否相等 ####   [shuffle][shuffle]  洗牌函数（打乱数组） ### Store ####   [saveToLocal][saveToLocal]  本地（localStorage）存储数据 ####   [loadFromLocal][loadFromLocal]  读取localStorage数据 ### Class ####   [addClass][addClass]  为元素添加class ####   [hasClass][hasClass]  判断元素是否有某个class ####   [removeClass][removeClass]  为元素移除class ####   [getByClass][getByClass]  找到父元素下所有含有对应class的项并以数组形式返回 ### Css ####   [css][css]  获取或设置行间样式 ####   [getStyle][getStyle]  获取非行间样式 ### Event ####   [addEvent][addEvent]  封装事件绑定，实现一种事件绑定多个事件处理函数 ### Cookie ####   [getCookie][getCookie]  根据name读取Cookie ####   [removeCookie][removeCookie]  根据name删除Cookie ####   [setCookie][setCookie]  添加Cookie ### Device ####   [getExplore][getExplore]  获取浏览器类型和版本号 ####   [getOS][getOS]  获取操作系统类型 ### Dom ####   [getScrollTop][getScrollTop]  获取滚动条距顶部的距离 ####   [offset][offset]  获取一个元素的距离文档(document)的位置，类似jQ中的offset() ####   [scrollTo][scrollTo]  在${duration}时间内，滚动条平滑滚动到${to}指定位置 ####   [setScrollTop][setScrollTop]  设置滚动条距顶部的距离 ####   [windowResize][windowResize]  H5软键盘缩回、弹起回调 ### Function ####   [debounce][debounce]  函数防抖 ####   [throttle][throttle]  函数节流 ### Keycode ####   [getKeyName][getKeyName]  根据keycode获得键名 ### Object ####   [deepClone][deepClone]  深拷贝，支持常见类型 ####   [isEmptyObject][isEmptyObject]  判断Object是否为空 ### Random ####   [randomColor][randomColor]   随机生成颜色 ####   [randomNum][randomNum]  生成指定范围随机数 ### Regexp ####   [isEmail][isEmail]  判断是否为邮箱地址 ####   [isIdCard][isIdCard]  判断是否为身份证号 ####   [isPhoneNum][isPhoneNum]  判断是否为手机号 ####   [isUrl][isUrl]  判断是否为URL地址 ### Number ####   [digitUppercase][digitUppercase]  现金额转大写 ####   [numToChinese][numToChinese]  将阿拉伯数字翻译成中文的大写数字 ### String ####   [changeCase][changeCase]  字母大小写转换 ####   [checkPwd][checkPwd]  检测密码强度 ####   [trim][trim]  去除空格 ### Support ####   [isSupportWebP][isSupportWebP]  判断浏览器是否支持webP格式图片 #### ### Time ####   [formatDate][formatDate]  日期格式转化 ####   [formatPassTime][formatPassTime]  格式化${startTime}距现在的已过时间 ####   [formatRemainTime][formatRemainTime]  格式化现在距${endTime}的剩余时间 ####   [isLeapYear][isLeapYear]  判断是否为闰年 ####   [isSameDay][isSameDay]  判断是否为同一天 ### Url ####   [parseQueryString][parseQueryString]  url参数转对象 ####   [stringfyQueryString][stringfyQueryString]  对象序列化 [arrayEqual]:https://github.com/hyy520/toolsbox/blob/master/src/array/arrayEqual.js [shuffle]:https://github.com/hyy520/toolsbox/blob/master/src/array/shuffle.js [saveToLocal]:https://github.com/hyy520/toolsbox/blob/master/src/store/saveToLocal.js [loadFromLocal]:https://github.com/hyy520/toolsbox/blob/master/src/store/loadFromLocal.js [addClass]:https://github.com/hyy520/toolsbox/blob/master/src/class/addClass.js [hasClass]:https://github.com/hyy520/toolsbox/blob/master/src/class/hasClass.js [removeClass]:https://github.com/hyy520/toolsbox/blob/master/src/class/removeClass.js [getByClass]:https://github.com/hyy520/toolsbox/blob/master/src/class/getByClass.js [css]:https://github.com/hyy520/toolsbox/blob/master/src/css/css.js [getStyle]:https://github.com/hyy520/toolsbox/blob/master/src/css/getStyle.js [addEvent]:https://github.com/hyy520/toolsbox/blob/master/src/event/addEvent.js [getCookie]:https://github.com/hyy520/toolsbox/blob/master/src/cookie/getCookie.js [removeCookie]:https://github.com/hyy520/toolsbox/blob/master/src/cookie/removeCookie.js [setCookie]:https://github.com/hyy520/toolsbox/blob/master/src/cookie/setCookie.js [getExplore]:https://github.com/hyy520/toolsbox/blob/master/src/device/getExplore.js [getOS]:https://github.com/hyy520/toolsbox/blob/master/src/device/getOS.js [getScrollTop]:https://github.com/hyy520/toolsbox/blob/master/src/dom/getScrollTop.js [offset]:https://github.com/hyy520/toolsbox/blob/master/src/dom/offset.js [scrollTo]:https://github.com/hyy520/toolsbox/blob/master/src/dom/scrollTo.js [setScrollTop]:https://github.com/hyy520/toolsbox/blob/master/src/dom/setScrollTop.js [windowResize]:https://github.com/hyy520/toolsbox/blob/master/src/dom/windowResize.js [debounce]:https://github.com/hyy520/toolsbox/blob/master/src/function/debounce.js [throttle]:https://github.com/hyy520/toolsbox/blob/master/src/function/throttle.js [getKeyName]:https://github.com/hyy520/toolsbox/blob/master/src/keycode/getKeyName.js [deepClone]:https://github.com/hyy520/toolsbox/blob/master/src/object/deepClone.js [isEmptyObject]:https://github.com/hyy520/toolsbox/blob/master/src/object/isEmptyObject.js [randomColor]:https://github.com/hyy520/toolsbox/blob/master/src/random/randomColor.js [randomNum]:https://github.com/hyy520/toolsbox/blob/master/src/random/randomNum.js [isEmail]:https://github.com/hyy520/toolsbox/blob/master/src/regexp/isEmail.js [isIdCard]:https://github.com/hyy520/toolsbox/blob/master/src/regexp/isIdCard.js [isPhoneNum]:https://github.com/hyy520/toolsbox/blob/master/src/regexp/isPhoneNum.js [isUrl]:https://github.com/hyy520/toolsbox/blob/master/src/regexp/isUrl.js [digitUppercase]:https://github.com/hyy520/toolsbox/blob/master/src/number/digitUppercase.js [numToChinese]:https://github.com/hyy520/toolsbox/blob/master/src/number/numToChinese.js [changeCase]:https://github.com/hyy520/toolsbox/blob/master/src/string/changeCase.js [checkPwd]:https://github.com/hyy520/toolsbox/blob/master/src/string/checkPwd.js [trim]:https://github.com/hyy520/toolsbox/blob/master/src/string/trim.js [isSupportWebP]:https://github.com/hyy520/toolsbox/blob/master/src/support/isSupportWebP.js [formatDate]:https://github.com/hyy520/toolsbox/blob/master/src/time/formatDate.js [formatPassTime]:https://github.com/hyy520/toolsbox/blob/master/src/time/formatPassTime.js [formatRemainTime]:https://github.com/hyy520/toolsbox/blob/master/src/time/formatRemainTime.js [isLeapYear]:https://github.com/hyy520/toolsbox/blob/master/src/time/isLeapYear.js [isSameDay]:https://github.com/hyy520/toolsbox/blob/master/src/time/isSameDay.js [parseQueryString]:https://github.com/hyy520/toolsbox/blob/master/src/url/parseQueryString.js [stringfyQueryString]:https://github.com/hyy520/toolsbox/blob/master/src/url/stringfyQueryString.js