javascript 总结（常用工具类的封装）

迷南。 2021-09-14 15:46 451阅读 0赞

一.javaScript

1. type 类型判断

  1. isString (o) { //是否字符串
  2.     return Object.prototype.toString.call(o).slice(8, -1) === 'String'
  3. }
  5. isNumber (o) { //是否数字
  6.     return Object.prototype.toString.call(o).slice(8, -1) === 'Number'
  7. }
  9. isObj (o) { //是否对象
  10.     return Object.prototype.toString.call(o).slice(8, -1) === 'Object'
  11. }
  13. isArray (o) { //是否数组
  14.     return Object.prototype.toString.call(o).slice(8, -1) === 'Array'
  15. }
  17. isDate (o) { //是否时间
  18.     return Object.prototype.toString.call(o).slice(8, -1) === 'Date'
  19. }
  21. isBoolean (o) { //是否boolean
  22.     return Object.prototype.toString.call(o).slice(8, -1) === 'Boolean'
  23. }
  25. isFunction (o) { //是否函数
  26.     return Object.prototype.toString.call(o).slice(8, -1) === 'Function'
  27. }
  29. isNull (o) { //是否为null
  30.     return Object.prototype.toString.call(o).slice(8, -1) === 'Null'
  31. }
  33. isUndefined (o) { //是否undefined
  34.     return Object.prototype.toString.call(o).slice(8, -1) === 'Undefined'
  35. }
  37. isFalse (o) {
  38.     if (!o || o === 'null' || o === 'undefined' || o === 'false' || o === 'NaN') return true
  39.         return false
  40. }
  42. isTrue (o) {
  43.     return !this.isFalse(o)
  44. }
  46. isIos () {
  47.     var u = navigator.userAgent;
  48.     if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
  49.         // return "Android";
  50.         return false
  51.     } else if (u.indexOf('iPhone') > -1) {//苹果手机
  52.         // return "iPhone";
  53.         return true
  54.     } else if (u.indexOf('iPad') > -1) {//iPad
  55.         // return "iPad";
  56.         return false
  57.     } else if (u.indexOf('Windows Phone') > -1) {//winphone手机
  58.         // return "Windows Phone";
  59.         return false
  60.     }else{
  61.         return false
  62.     }
  63. }
  65. isPC () { //是否为PC端
  66.     var userAgentInfo = navigator.userAgent;
  67.     var Agents = ["Android", "iPhone",
  68.                 "SymbianOS", "Windows Phone",
  69.                 "iPad", "iPod"];
  70.     var flag = true;
  71.     for (var v = 0; v < Agents.length; v++) {
  72.         if (userAgentInfo.indexOf(Agents[v]) > 0) {
  73.             flag = false;
  74.             break;
  75.         }
  76.     }
  77.     return flag;
  78. }
  80. browserType(){
  81.     var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  82.     var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器
  83.     var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器
  84.     var isEdge = userAgent.indexOf("Edge") > -1; //判断是否IE的Edge浏览器
  85.     var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器
  86.     var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1; //判断是否Safari浏览器
  87.     var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1; //判断Chrome浏览器
  88.     if (isIE) {
  89.         var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
  90.         reIE.test(userAgent);
  91.         var fIEVersion = parseFloat(RegExp["$1"]);
  92.         if(fIEVersion == 7) return "IE7"
  93.         else if(fIEVersion == 8) return "IE8";
  94.         else if(fIEVersion == 9) return "IE9";
  95.         else if(fIEVersion == 10) return "IE10";
  96.         else if(fIEVersion == 11) return "IE11";
  97.         else return "IE7以下"//IE版本过低
  98.     }
  100.     if (isFF) return "FF";
  101.     if (isOpera) return "Opera";
  102.     if (isEdge) return "Edge";
  103.     if (isSafari) return "Safari";
  104.     if (isChrome) return "Chrome";
  105. }
  107. checkStr (str, type) {
  108.     switch (type) {
  109.         case 'phone':   //手机号码
  110.             return /^1[3|4|5|7|8][0-9]{9}$/.test(str);
  111.         case 'tel':     //座机
  112.             return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
  113.         case 'card':    //身份证
  114.             return /^\d{15}|\d{18}$/.test(str);
  115.         case 'pwd':     //密码以字母开头，长度在6~18之间，只能包含字母、数字和下划线
  116.             return /^[a-zA-Z]\w{5,17}$/.test(str)
  117.         case 'postal':  //邮政编码
  118.             return /[1-9]\d{5}(?!\d)/.test(str);
  119.         case 'QQ':      //QQ号
  120.             return /^[1-9][0-9]{4,9}$/.test(str);
  121.         case 'email':   //邮箱
  122.             return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
  123.         case 'money':   //金额(小数点2位)
  124.             return /^\d*(?:\.\d{0,2})?$/.test(str);
  125.         case 'URL':     //网址
  126.             return /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(str)
  127.         case 'IP':      //IP
  128.             return /((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))/.test(str);
  129.         case 'date':    //日期时间
  130.             return /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2})(?:\:\d{2}|:(\d{2}):(\d{2}))$/.test(str) || /^(\d{4})\-(\d{2})\-(\d{2})$/.test(str)
  131.         case 'number':  //数字
  132.             return /^[0-9]$/.test(str);
  133.         case 'english': //英文
  134.             return /^[a-zA-Z]+$/.test(str);
  135.         case 'chinese': //中文
  136.             return /^[\u4E00-\u9FA5]+$/.test(str);
  137.         case 'lower':   //小写
  138.             return /^[a-z]+$/.test(str);
  139.         case 'upper':   //大写
  140.             return /^[A-Z]+$/.test(str);
  141.         case 'HTML':    //HTML标记
  142.             return /<("[^"]*"|'[^']*'|[^'">])*>/.test(str);
  143.         default:
  144.             return true;
  145.     }
  146. }

2. Date

  1. /**
  2.  * 格式化时间
  3.  * 
  4.  * @param  {time} 时间
  5.  * @param  {cFormat} 格式
  6.  * @return {String} 字符串
  7.  *
  8.  * @example formatTime('2018-1-29', '{y}/{m}/{d} {h}:{i}:{s}') // -> 2018/01/29 00:00:00
  9.  */
  10. formatTime(time, cFormat) {
  11.     if (arguments.length === 0) return null
  12.     if ((time + '').length === 10) {
  13.         time = +time * 1000
  14.     }
  16.     var format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}', date
  17.     if (typeof time === 'object') {
  18.         date = time
  19.     } else {
  20.         date = new Date(time)
  21.     }
  23.     var formatObj = {
  24.         y: date.getFullYear(),
  25.         m: date.getMonth() + 1,
  26.         d: date.getDate(),
  27.         h: date.getHours(),
  28.         i: date.getMinutes(),
  29.         s: date.getSeconds(),
  30.         a: date.getDay()
  31.     }
  32.     var time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
  33.         var value = formatObj[key]
  34.         if (key === 'a') return ['一', '二', '三', '四', '五', '六', '日'][value - 1]
  35.         if (result.length > 0 && value < 10) {
  36.             value = '0' + value
  37.         }
  38.         return value || 0
  39.     })
  40.     return time_str
  41. }
  44. /**
  45.  * 返回指定长度的月份集合
  46.  * 
  47.  * @param  {time} 时间
  48.  * @param  {len} 长度
  49.  * @param  {direction} 方向：  1: 前几个月;  2: 后几个月;  3:前后几个月  默认 3
  50.  * @return {Array} 数组
  51.  * 
  52.  * @example   getMonths('2018-1-29', 6, 1)  // ->  ["2018-1", "2017-12", "2017-11", "2017-10", "2017-9", "2017-8", "2017-7"]
  53.  */
  54. getMonths(time, len, direction) {
  55.     var mm = new Date(time).getMonth(),
  56.         yy = new Date(time).getFullYear(),
  57.         direction = isNaN(direction) ? 3 : direction,
  58.         index = mm;
  59.     var cutMonth = function(index) {
  60.         if ( index <= len && index >= -len) {
  61.             return direction === 1 ? formatPre(index).concat(cutMonth(++index)):
  62.                 direction === 2 ? formatNext(index).concat(cutMonth(++index)):formatCurr(index).concat(cutMonth(++index))
  63.         }
  64.         return []
  65.     }
  66.     var formatNext = function(i) {
  67.         var y = Math.floor(i/12),
  68.             m = i%12
  69.         return [yy+y + '-' + (m+1)]
  70.     }
  71.     var formatPre = function(i) {
  72.         var y = Math.ceil(i/12),
  73.             m = i%12
  74.         m = m===0 ? 12 : m
  75.         return [yy-y + '-' + (13 - m)]
  76.     }
  77.     var formatCurr = function(i) {
  78.         var y = Math.floor(i/12),
  79.             yNext = Math.ceil(i/12),
  80.             m = i%12,
  81.             mNext = m===0 ? 12 : m
  82.         return [yy-yNext + '-' + (13 - mNext),yy+y + '-' + (m+1)]
  83.     }
  84.     // 数组去重
  85.     var unique = function(arr) {
  86.         if ( Array.hasOwnProperty('from') ) {
  87.             return Array.from(new Set(arr));
  88.         }else{
  89.             var n = {},r=[]; 
  90.             for(var i = 0; i < arr.length; i++){
  91.                 if (!n[arr[i]]){
  92.                     n[arr[i]] = true; 
  93.                     r.push(arr[i]);
  94.                 }
  95.             }
  96.             return r;
  97.         }
  98.     }
  99.     return direction !== 3 ? cutMonth(index) : unique(cutMonth(index).sort(function(t1, t2){
  100.         return new Date(t1).getTime() - new Date(t2).getTime()
  101.     }))
  102. }
  106. /**
  107.  * 返回指定长度的天数集合
  108.  * 
  109.  * @param  {time} 时间
  110.  * @param  {len} 长度
  111.  * @param  {direction} 方向： 1: 前几天;  2: 后几天;  3:前后几天  默认 3
  112.  * @return {Array} 数组
  113.  *
  114.  * @example date.getDays('2018-1-29', 6) // -> ["2018-1-26", "2018-1-27", "2018-1-28", "2018-1-29", "2018-1-30", "2018-1-31", "2018-2-1"]
  115.  */
  116. getDays(time, len, diretion) {
  117.     var tt = new Date(time)
  118.     var getDay = function(day) {
  119.         var t = new Date(time)
  120.         t.setDate(t.getDate() + day)
  121.         var m = t.getMonth()+1
  122.         return t.getFullYear()+'-'+m+'-'+t.getDate()
  123.     }
  124.     var arr = []
  125.     if (diretion === 1) {
  126.         for (var i = 1; i <= len; i++) {
  127.             arr.unshift(getDay(-i))
  128.         }
  129.     }else if(diretion === 2) {
  130.         for (var i = 1; i <= len; i++) {
  131.             arr.push(getDay(i))
  132.         }
  133.     }else {
  134.         for (var i = 1; i <= len; i++) {
  135.             arr.unshift(getDay(-i))
  136.         }
  137.         arr.push(tt.getFullYear()+'-'+(tt.getMonth()+1)+'-'+tt.getDate())
  138.         for (var i = 1; i <= len; i++) {
  139.             arr.push(getDay(i))
  140.         }
  141.     }
  142.     return diretion === 1 ? arr.concat([tt.getFullYear()+'-'+(tt.getMonth()+1)+'-'+tt.getDate()]) : 
  143.         diretion === 2 ? [tt.getFullYear()+'-'+(tt.getMonth()+1)+'-'+tt.getDate()].concat(arr) : arr
  144. }
  147. /**
  148.  * @param  {s} 秒数
  149.  * @return {String} 字符串 
  150.  *
  151.  * @example formatHMS(3610) // -> 1h0m10s
  152.  */
  153. formatHMS (s) {
  154.     var str = ''
  155.     if (s > 3600) {
  156.         str = Math.floor(s/3600)+'h'+Math.floor(s%3600/60)+'m'+s%60+'s'
  157.     }else if(s > 60) {
  158.         str = Math.floor(s/60)+'m'+s%60+'s'
  159.     }else{
  160.         str = s%60+'s'
  161.     }
  162.     return str
  163. }
  165. /*获取某月有多少天*/
  166. getMonthOfDay (time) {
  167.     var date = new Date(time)
  168.     var year = date.getFullYear()
  169.     var mouth = date.getMonth() + 1
  170.     var days
  172.     //当月份为二月时，根据闰年还是非闰年判断天数
  173.     if (mouth == 2) {
  174.         days = year % 4 == 0 ? 29 : 28
  175.     } else if (mouth == 1 || mouth == 3 || mouth == 5 || mouth == 7 || mouth == 8 || mouth == 10 || mouth == 12) {
  176.         //月份为：1,3,5,7,8,10,12 时，为大月.则天数为31；
  177.         days = 31
  178.     } else {
  179.         //其他月份，天数为：30.
  180.         days = 30
  181.     }
  182.     return days
  183. }
  185. /*获取某年有多少天*/
  186. getYearOfDay (time) {
  187.     var firstDayYear = this.getFirstDayOfYear(time);
  188.     var lastDayYear = this.getLastDayOfYear(time);
  189.     var numSecond = (new Date(lastDayYear).getTime() - new Date(firstDayYear).getTime())/1000;
  190.     return Math.ceil(numSecond/(24*3600));
  191. }
  193. /*获取某年的第一天*/
  194. getFirstDayOfYear (time) {
  195.     var year = new Date(time).getFullYear();
  196.     return year + "-01-01 00:00:00";
  197. }
  199. /*获取某年最后一天*/
  200. getLastDayOfYear (time) {
  201.     var year = new Date(time).getFullYear();
  202.     var dateString = year + "-12-01 00:00:00";
  203.     var endDay = this.getMonthOfDay(dateString);
  204.     return year + "-12-" + endDay + " 23:59:59";
  205. }
  207. /*获取某个日期是当年中的第几天*/
  208. getDayOfYear (time) {
  209.     var firstDayYear = this.getFirstDayOfYear(time);
  210.     var numSecond = (new Date(time).getTime() - new Date(firstDayYear).getTime())/1000;
  211.     return Math.ceil(numSecond/(24*3600));
  212. }
  214. /*获取某个日期在这一年的第几周*/
  215. getDayOfYearWeek (time) {
  216.     var numdays = this.getDayOfYear(time);
  217.     return Math.ceil(numdays / 7);
  218. }

3. Array

  1. /*判断一个元素是否在数组中*/
  2. contains (arr, val) {
  3.     return arr.indexOf(val) != -1 ? true : false;
  4. }
  7. /**
  8.  * @param  {arr} 数组
  9.  * @param  {fn} 回调函数
  10.  * @return {undefined}
  11.  */
  12. each (arr, fn) {
  13.     fn = fn || Function;
  14.     var a = [];
  15.     var args = Array.prototype.slice.call(arguments, 1);
  16.     for(var i = 0; i < arr.length; i++) {
  17.         var res = fn.apply(arr, [arr[i], i].concat(args));
  18.         if(res != null) a.push(res);
  19.     }
  20. }
  22. /**
  23.  * @param  {arr} 数组
  24.  * @param  {fn} 回调函数
  25.  * @param  {thisObj} this指向
  26.  * @return {Array} 
  27.  */
  28. map (arr, fn, thisObj) {
  29.     var scope = thisObj || window;
  30.     var a = [];
  31.     for(var i = 0, j = arr.length; i < j; ++i) {
  32.         var res = fn.call(scope, arr[i], i, this);
  33.         if(res != null) a.push(res);
  34.     }
  35.     return a;
  36. }
  39. /**
  40.  * @param  {arr} 数组
  41.  * @param  {type} 1：从小到大   2：从大到小   3：随机
  42.  * @return {Array}
  43.  */
  44. sort (arr, type = 1) {
  45.     return arr.sort( (a, b) => {
  46.         switch(type) {
  47.             case 1:
  48.                 return a - b;
  49.             case 2:
  50.                 return b - a;
  51.             case 3:
  52.                 return Math.random() - 0.5;
  53.             default:
  54.                 return arr;
  55.         }
  56.     })
  57. }
  59. /*去重*/
  60. unique (arr) {
  61.     if ( Array.hasOwnProperty('from') ) {
  62.         return Array.from(new Set(arr));
  63.     }else{
  64.         var n = {},r=[]; 
  65.         for(var i = 0; i < arr.length; i++){
  66.             if (!n[arr[i]]){
  67.                 n[arr[i]] = true; 
  68.                 r.push(arr[i]);
  69.             }
  70.         }
  71.         return r;
  72.     }
  73. }
  75. /*求两个集合的并集*/
  76. union (a, b) {
  77.     var newArr = a.concat(b);
  78.     return this.unique(newArr);
  79. }
  81. /*求两个集合的交集*/
  82. intersect (a, b) {
  83.     var _this = this;
  84.     a = this.unique(a);
  85.     return this.map(a, function(o) {
  86.         return _this.contains(b, o) ? o : null;
  87.     });
  88. }
  90. /*删除其中一个元素*/
  91. remove (arr, ele) {
  92.     var index = arr.indexOf(ele);
  93.     if(index > -1) {
  94.         arr.splice(index, 1);
  95.     }
  96.     return arr;
  97. }
  99. /*将类数组转换为数组的方法*/
  100. formArray (ary) {
  101.     var arr = [];
  102.     if(Array.isArray(ary)) {
  103.         arr = ary;
  104.     } else {
  105.         arr = Array.prototype.slice.call(ary);
  106.     };
  107.     return arr;
  108. }
  110. /*最大值*/
  111. max (arr) {
  112.     return Math.max.apply(null, arr);
  113. }
  115. /*最小值*/
  116. min (arr) {
  117.     return Math.min.apply(null, arr);
  118. }
  120. /*求和*/
  121. sum (arr) {
  122.     return arr.reduce( (pre, cur) => {
  123.         return pre + cur
  124.     })
  125. }
  127. /*平均值*/
  128. average (arr) {
  129.     return this.sum(arr)/arr.length
  130. }

4. String 字符串操作

  1. /**
  2.  * 去除空格
  3.  * @param  {str}
  4.  * @param  {type} 
  5.  *       type:  1-所有空格  2-前后空格  3-前空格 4-后空格
  6.  * @return {String}
  7.  */
  8. trim (str, type) {
  9.     type = type || 1
  10.     switch (type) {
  11.         case 1:
  12.             return str.replace(/\s+/g, "");
  13.         case 2:
  14.             return str.replace(/(^\s*)|(\s*$)/g, "");
  15.         case 3:
  16.             return str.replace(/(^\s*)/g, "");
  17.         case 4:
  18.             return str.replace(/(\s*$)/g, "");
  19.         default:
  20.             return str;
  21.     }
  22. }
  24. /**
  25.  * @param  {str} 
  26.  * @param  {type}
  27.  *       type:  1:首字母大写  2：首页母小写  3：大小写转换  4：全部大写  5：全部小写
  28.  * @return {String}
  29.  */
  30. changeCase (str, type) {
  31.     type = type || 4
  32.     switch (type) {
  33.         case 1:
  34.             return str.replace(/\b\w+\b/g, function (word) {
  35.                 return word.substring(0, 1).toUpperCase() + word.substring(1).toLowerCase();
  37.             });
  38.         case 2:
  39.             return str.replace(/\b\w+\b/g, function (word) {
  40.                 return word.substring(0, 1).toLowerCase() + word.substring(1).toUpperCase();
  41.             });
  42.         case 3:
  43.             return str.split('').map( function(word){
  44.                 if (/[a-z]/.test(word)) {
  45.                     return word.toUpperCase();
  46.                 }else{
  47.                     return word.toLowerCase()
  48.                 }
  49.             }).join('')
  50.         case 4:
  51.             return str.toUpperCase();
  52.         case 5:
  53.             return str.toLowerCase();
  54.         default:
  55.             return str;
  56.     }
  57. }
  60. /*
  61.     检测密码强度
  62. */
  63. checkPwd (str) {
  64.     var Lv = 0;
  65.     if (str.length < 6) {
  66.         return Lv
  67.     }
  68.     if (/[0-9]/.test(str)) {
  69.         Lv++
  70.     }
  71.     if (/[a-z]/.test(str)) {
  72.         Lv++
  73.     }
  74.     if (/[A-Z]/.test(str)) {
  75.         Lv++
  76.     }
  77.     if (/[\.|-|_]/.test(str)) {
  78.         Lv++
  79.     }
  80.     return Lv;
  81. }
  83. /*过滤html代码(把<>转换)*/
  84. filterTag (str) {
  85.     str = str.replace(/&/ig, "&");
  86.     str = str.replace(/</ig, "<");
  87.     str = str.replace(/>/ig, ">");
  88.     str = str.replace(" ", " ");
  89.     return str;
  90. }

5. Number

  1. /*随机数范围*/
  2. random (min, max) {
  3.     if (arguments.length === 2) {
  4.         return Math.floor(min + Math.random() * ( (max+1) - min ))
  5.     }else{
  6.         return null;
  7.     }
  9. }
  11. /*将阿拉伯数字翻译成中文的大写数字*/
  12. numberToChinese (num) {
  13.     var AA = new Array("零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十");
  14.     var BB = new Array("", "十", "百", "仟", "萬", "億", "点", "");
  15.     var a = ("" + num).replace(/(^0*)/g, "").split("."),
  16.         k = 0,
  17.         re = "";
  18.     for(var i = a[0].length - 1; i >= 0; i--) {
  19.         switch(k) {
  20.             case 0:
  21.                 re = BB[7] + re;
  22.                 break;
  23.             case 4:
  24.                 if(!new RegExp("0{4}//d{" + (a[0].length - i - 1) + "}$")
  25.                     .test(a[0]))
  26.                     re = BB[4] + re;
  27.                 break;
  28.             case 8:
  29.                 re = BB[5] + re;
  30.                 BB[7] = BB[5];
  31.                 k = 0;
  32.                 break;
  33.         }
  34.         if(k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0)
  35.             re = AA[0] + re;
  36.         if(a[0].charAt(i) != 0)
  37.             re = AA[a[0].charAt(i)] + BB[k % 4] + re;
  38.         k++;
  39.     }
  41.     if(a.length > 1) // 加上小数部分(如果有小数部分)
  42.     {
  43.         re += BB[6];
  44.         for(var i = 0; i < a[1].length; i++)
  45.             re += AA[a[1].charAt(i)];
  46.     }
  47.     if(re == '一十')
  48.         re = "十";
  49.     if(re.match(/^一/) && re.length == 3)
  50.         re = re.replace("一", "");
  51.     return re;
  52. }
  54. /*将数字转换为大写金额*/
  55. changeToChinese (Num) {
  56.         //判断如果传递进来的不是字符的话转换为字符
  57.         if(typeof Num == "number") {
  58.             Num = new String(Num);
  59.         };
  60.         Num = Num.replace(/,/g, "") //替换tomoney()中的“,”
  61.         Num = Num.replace(/ /g, "") //替换tomoney()中的空格
  62.         Num = Num.replace(/￥/g, "") //替换掉可能出现的￥字符
  63.         if(isNaN(Num)) { //验证输入的字符是否为数字
  64.             //alert("请检查小写金额是否正确");
  65.             return "";
  66.         };
  67.         //字符处理完毕后开始转换，采用前后两部分分别转换
  68.         var part = String(Num).split(".");
  69.         var newchar = "";
  70.         //小数点前进行转化
  71.         for(var i = part[0].length - 1; i >= 0; i--) {
  72.             if(part[0].length > 10) {
  73.                 return "";
  74.                 //若数量超过拾亿单位，提示
  75.             }
  76.             var tmpnewchar = ""
  77.             var perchar = part[0].charAt(i);
  78.             switch(perchar) {
  79.                 case "0":
  80.                     tmpnewchar = "零" + tmpnewchar;
  81.                     break;
  82.                 case "1":
  83.                     tmpnewchar = "壹" + tmpnewchar;
  84.                     break;
  85.                 case "2":
  86.                     tmpnewchar = "贰" + tmpnewchar;
  87.                     break;
  88.                 case "3":
  89.                     tmpnewchar = "叁" + tmpnewchar;
  90.                     break;
  91.                 case "4":
  92.                     tmpnewchar = "肆" + tmpnewchar;
  93.                     break;
  94.                 case "5":
  95.                     tmpnewchar = "伍" + tmpnewchar;
  96.                     break;
  97.                 case "6":
  98.                     tmpnewchar = "陆" + tmpnewchar;
  99.                     break;
  100.                 case "7":
  101.                     tmpnewchar = "柒" + tmpnewchar;
  102.                     break;
  103.                 case "8":
  104.                     tmpnewchar = "捌" + tmpnewchar;
  105.                     break;
  106.                 case "9":
  107.                     tmpnewchar = "玖" + tmpnewchar;
  108.                     break;
  109.             }
  110.             switch(part[0].length - i - 1) {
  111.                 case 0:
  112.                     tmpnewchar = tmpnewchar + "元";
  113.                     break;
  114.                 case 1:
  115.                     if(perchar != 0) tmpnewchar = tmpnewchar + "拾";
  116.                     break;
  117.                 case 2:
  118.                     if(perchar != 0) tmpnewchar = tmpnewchar + "佰";
  119.                     break;
  120.                 case 3:
  121.                     if(perchar != 0) tmpnewchar = tmpnewchar + "仟";
  122.                     break;
  123.                 case 4:
  124.                     tmpnewchar = tmpnewchar + "万";
  125.                     break;
  126.                 case 5:
  127.                     if(perchar != 0) tmpnewchar = tmpnewchar + "拾";
  128.                     break;
  129.                 case 6:
  130.                     if(perchar != 0) tmpnewchar = tmpnewchar + "佰";
  131.                     break;
  132.                 case 7:
  133.                     if(perchar != 0) tmpnewchar = tmpnewchar + "仟";
  134.                     break;
  135.                 case 8:
  136.                     tmpnewchar = tmpnewchar + "亿";
  137.                     break;
  138.                 case 9:
  139.                     tmpnewchar = tmpnewchar + "拾";
  140.                     break;
  141.             }
  142.             var newchar = tmpnewchar + newchar;
  143.         }
  144.         //小数点之后进行转化
  145.         if(Num.indexOf(".") != -1) {
  146.             if(part[1].length > 2) {
  147.                 // alert("小数点之后只能保留两位,系统将自动截断");
  148.                 part[1] = part[1].substr(0, 2)
  149.             }
  150.             for(i = 0; i < part[1].length; i++) {
  151.                 tmpnewchar = ""
  152.                 perchar = part[1].charAt(i)
  153.                 switch(perchar) {
  154.                     case "0":
  155.                         tmpnewchar = "零" + tmpnewchar;
  156.                         break;
  157.                     case "1":
  158.                         tmpnewchar = "壹" + tmpnewchar;
  159.                         break;
  160.                     case "2":
  161.                         tmpnewchar = "贰" + tmpnewchar;
  162.                         break;
  163.                     case "3":
  164.                         tmpnewchar = "叁" + tmpnewchar;
  165.                         break;
  166.                     case "4":
  167.                         tmpnewchar = "肆" + tmpnewchar;
  168.                         break;
  169.                     case "5":
  170.                         tmpnewchar = "伍" + tmpnewchar;
  171.                         break;
  172.                     case "6":
  173.                         tmpnewchar = "陆" + tmpnewchar;
  174.                         break;
  175.                     case "7":
  176.                         tmpnewchar = "柒" + tmpnewchar;
  177.                         break;
  178.                     case "8":
  179.                         tmpnewchar = "捌" + tmpnewchar;
  180.                         break;
  181.                     case "9":
  182.                         tmpnewchar = "玖" + tmpnewchar;
  183.                         break;
  184.                 }
  185.                 if(i == 0) tmpnewchar = tmpnewchar + "角";
  186.                 if(i == 1) tmpnewchar = tmpnewchar + "分";
  187.                 newchar = newchar + tmpnewchar;
  188.             }
  189.         }
  190.         //替换所有无用汉字
  191.         while(newchar.search("零零") != -1)
  192.             newchar = newchar.replace("零零", "零");
  193.         newchar = newchar.replace("零亿", "亿");
  194.         newchar = newchar.replace("亿万", "亿");
  195.         newchar = newchar.replace("零万", "万");
  196.         newchar = newchar.replace("零元", "元");
  197.         newchar = newchar.replace("零角", "");
  198.         newchar = newchar.replace("零分", "");
  199.         if(newchar.charAt(newchar.length - 1) == "元") {
  200.             newchar = newchar + "整"
  201.         }
  202.         return newchar;
  203.     }

6. Http

  1. /**
  2.  * @param  {setting}
  3.  */
  4. ajax(setting){
  5.     //设置参数的初始值
  6.     var opts={
  7.         method: (setting.method || "GET").toUpperCase(), //请求方式
  8.         url: setting.url || "", // 请求地址
  9.         async: setting.async || true, // 是否异步
  10.         dataType: setting.dataType || "json", // 解析方式
  11.         data: setting.data || "", // 参数
  12.         success: setting.success || function(){}, // 请求成功回调
  13.         error: setting.error || function(){} // 请求失败回调
  14.     }
  16.     // 参数格式化
  17.     function params_format (obj) {
  18.         var str = ''
  19.         for (var i in obj) {
  20.             str += i + '=' + obj[i] + '&'
  21.         }
  22.         return str.split('').slice(0, -1).join('')
  23.     }
  25.     // 创建ajax对象
  26.     var xhr=new XMLHttpRequest();
  28.     // 连接服务器open(方法GET/POST，请求地址， 异步传输)
  29.     if(opts.method == 'GET'){
  30.         xhr.open(opts.method, opts.url + "?" + params_format(opts.data), opts.async);
  31.         xhr.send();
  32.     }else{
  33.         xhr.open(opts.method, opts.url, opts.async);
  34.         xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  35.         xhr.send(opts.data);
  36.     }
  38.     /*
  39.     ** 每当readyState改变时，就会触发onreadystatechange事件
  40.     ** readyState属性存储有XMLHttpRequest的状态信息
  41.     ** 0 ：请求未初始化
  42.     ** 1 ：服务器连接已建立
  43.     ** 2 ：请求已接受
  44.     ** 3 : 请求处理中
  45.     ** 4 ：请求已完成，且相应就绪
  46.     */
  47.     xhr.onreadystatechange = function() {
  48.         if (xhr.readyState === 4 && (xhr.status === 200 || xhr.status === 304)) {
  49.             switch(opts.dataType){
  50.                 case "json":
  51.                     var json = JSON.parse(xhr.responseText);
  52.                     opts.success(json);
  53.                     break;
  54.                 case "xml":
  55.                     opts.success(xhr.responseXML);
  56.                     break;
  57.                 default:
  58.                     opts.success(xhr.responseText);
  59.                     break;
  60.             }
  61.         }
  62.     }
  64.     xhr.onerror = function(err) {
  65.         opts.error(err);
  66.     }
  67. }
  69. /**
  70.  * @param  {url}
  71.  * @param  {setting}
  72.  * @return {Promise}
  73.  */
  74. fetch(url, setting) {
  75.     //设置参数的初始值
  76.     let opts={
  77.         method: (setting.method || 'GET').toUpperCase(), //请求方式
  78.         headers : setting.headers  || {}, // 请求头设置
  79.         credentials : setting.credentials  || true, // 设置cookie是否一起发送
  80.         body: setting.body || {},
  81.         mode : setting.mode  || 'no-cors', // 可以设置 cors, no-cors, same-origin
  82.         redirect : setting.redirect  || 'follow', // follow, error, manual
  83.         cache : setting.cache  || 'default' // 设置 cache 模式 (default, reload, no-cache)
  84.     }
  85.     let dataType = setting.dataType || "json", // 解析方式  
  86.         data = setting.data || "" // 参数
  88.     // 参数格式化
  89.     function params_format (obj) {
  90.         var str = ''
  91.         for (var i in obj) {
  92.             str += `${i}=${obj[i]}&`
  93.         }
  94.         return str.split('').slice(0, -1).join('')
  95.     }
  97.     if (opts.method === 'GET') {
  98.         url = url + (data?`?${params_format(data)}`:'')
  99.     }else{
  100.         setting.body = data || {}
  101.     }
  103.     return new Promise( (resolve, reject) => {
  104.         fetch(url, opts).then( async res => {
  105.             let data = dataType === 'text' ? await res.text() :
  106.                 dataType === 'blob' ? await res.blob() : await res.json() 
  107.             resolve(data)
  108.         }).catch( e => {
  109.             reject(e)
  110.         })
  111.     })
  113. }

7. DOM

  1. $ (selector){ 
  2.     var type = selector.substring(0, 1);
  3.     if (type === '#') {
  4.         if (document.querySelecotor) return document.querySelector(selector)
  5.             return document.getElementById(selector.substring(1))
  7.     }else if (type === '.') {
  8.         if (document.querySelecotorAll) return document.querySelectorAll(selector)
  9.             return document.getElementsByClassName(selector.substring(1))
  10.     }else{
  11.         return document['querySelectorAll' ? 'querySelectorAll':'getElementsByTagName'](selector)
  12.     }
  13. } 
  15. /*检测类名*/
  16. hasClass (ele, name) {
  17.     return ele.className.match(new RegExp('(\\s|^)' + name + '(\\s|$)'));
  18. }
  20. /*添加类名*/
  21. addClass (ele, name) {
  22.     if (!this.hasClass(ele, name)) ele.className += " " + name;
  23. }
  25. /*删除类名*/
  26. removeClass (ele, name) {
  27.     if (this.hasClass(ele, name)) {
  28.         var reg = new RegExp('(\\s|^)' + name + '(\\s|$)');
  29.         ele.className = ele.className.replace(reg, '');
  30.     }
  31. }
  33. /*替换类名*/
  34. replaceClass (ele, newName, oldName) {
  35.     this.removeClass(ele, oldName);
  36.     this.addClass(ele, newName);
  37. }
  39. /*获取兄弟节点*/
  40. siblings (ele) {
  41.     console.log(ele.parentNode)
  42.     var chid = ele.parentNode.children,eleMatch = []; 
  43.     for(var i = 0, len = chid.length; i < len; i ++){ 
  44.         if(chid[i] != ele){ 
  45.             eleMatch.push(chid[i]); 
  46.         } 
  47.     } 
  48.     return eleMatch;
  49. }
  51. /*获取行间样式属性*/
  52. getByStyle (obj,name){
  53.     if(obj.currentStyle){
  54.         return  obj.currentStyle[name];
  55.     }else{
  56.         return  getComputedStyle(obj,false)[name];
  57.     }
  58. }

8. Storage 储存操作

  1. class StorageFn {
  2.     constructor () {
  3.         this.ls = window.localStorage;
  4.         this.ss = window.sessionStorage;
  5.     }
  7.     /*-----------------cookie---------------------*/
  8.     /*设置cookie*/
  9.     setCookie (name, value, day) {
  10.         var setting = arguments[0];
  11.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  12.             for (var i in setting) {
  13.                 var oDate = new Date();
  14.                 oDate.setDate(oDate.getDate() + day);
  15.                 document.cookie = i + '=' + setting[i] + ';expires=' + oDate;
  16.             }
  17.         }else{
  18.             var oDate = new Date();
  19.             oDate.setDate(oDate.getDate() + day);
  20.             document.cookie = name + '=' + value + ';expires=' + oDate;
  21.         }
  23.     }
  25.     /*获取cookie*/
  26.     getCookie (name) {
  27.         var arr = document.cookie.split('; ');
  28.         for (var i = 0; i < arr.length; i++) {
  29.             var arr2 = arr[i].split('=');
  30.             if (arr2[0] == name) {
  31.                 return arr2[1];
  32.             }
  33.         }
  34.         return '';
  35.     }
  37.     /*删除cookie*/
  38.     removeCookie (name) {
  39.         this.setCookie(name, 1, -1);
  40.     }
  43.     /*-----------------localStorage---------------------*/
  44.     /*设置localStorage*/
  45.     setLocal(key, val) {
  46.         var setting = arguments[0];
  47.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  48.             for(var i in setting){
  49.                 this.ls.setItem(i, JSON.stringify(setting[i]))
  50.             }
  51.         }else{
  52.             this.ls.setItem(key, JSON.stringify(val))
  53.         }
  55.     }
  57.     /*获取localStorage*/
  58.     getLocal(key) {
  59.         if (key) return JSON.parse(this.ls.getItem(key))
  60.         return null;
  62.     }
  64.     /*移除localStorage*/
  65.     removeLocal(key) {
  66.         this.ls.removeItem(key)
  67.     }
  69.     /*移除所有localStorage*/
  70.     clearLocal() {
  71.         this.ls.clear()
  72.     }
  75.     /*-----------------sessionStorage---------------------*/
  76.     /*设置sessionStorage*/
  77.     setSession(key, val) {
  78.         var setting = arguments[0];
  79.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  80.             for(var i in setting){
  81.                 this.ss.setItem(i, JSON.stringify(setting[i]))
  82.             }
  83.         }else{
  84.             this.ss.setItem(key, JSON.stringify(val))
  85.         }
  87.     }
  89.     /*获取sessionStorage*/
  90.     getSession(key) {
  91.         if (key) return JSON.parse(this.ss.getItem(key))
  92.         return null;
  94.     }
  96.     /*移除sessionStorage*/
  97.     removeSession(key) {
  98.         this.ss.removeItem(key)
  99.     }
  101.     /*移除所有sessionStorage*/
  102.     clearSession() {
  103.         this.ss.clear()
  104.     }
  107. }

9. Other 其它操作

  1. class StorageFn {
  2.     constructor () {
  3.         this.ls = window.localStorage;
  4.         this.ss = window.sessionStorage;
  5.     }
  7.     /*-----------------cookie---------------------*/
  8.     /*设置cookie*/
  9.     setCookie (name, value, day) {
  10.         var setting = arguments[0];
  11.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  12.             for (var i in setting) {
  13.                 var oDate = new Date();
  14.                 oDate.setDate(oDate.getDate() + day);
  15.                 document.cookie = i + '=' + setting[i] + ';expires=' + oDate;
  16.             }
  17.         }else{
  18.             var oDate = new Date();
  19.             oDate.setDate(oDate.getDate() + day);
  20.             document.cookie = name + '=' + value + ';expires=' + oDate;
  21.         }
  23.     }
  25.     /*获取cookie*/
  26.     getCookie (name) {
  27.         var arr = document.cookie.split('; ');
  28.         for (var i = 0; i < arr.length; i++) {
  29.             var arr2 = arr[i].split('=');
  30.             if (arr2[0] == name) {
  31.                 return arr2[1];
  32.             }
  33.         }
  34.         return '';
  35.     }
  37.     /*删除cookie*/
  38.     removeCookie (name) {
  39.         this.setCookie(name, 1, -1);
  40.     }
  43.     /*-----------------localStorage---------------------*/
  44.     /*设置localStorage*/
  45.     setLocal(key, val) {
  46.         var setting = arguments[0];
  47.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  48.             for(var i in setting){
  49.                 this.ls.setItem(i, JSON.stringify(setting[i]))
  50.             }
  51.         }else{
  52.             this.ls.setItem(key, JSON.stringify(val))
  53.         }
  55.     }
  57.     /*获取localStorage*/
  58.     getLocal(key) {
  59.         if (key) return JSON.parse(this.ls.getItem(key))
  60.         return null;
  62.     }
  64.     /*移除localStorage*/
  65.     removeLocal(key) {
  66.         this.ls.removeItem(key)
  67.     }
  69.     /*移除所有localStorage*/
  70.     clearLocal() {
  71.         this.ls.clear()
  72.     }
  75.     /*-----------------sessionStorage---------------------*/
  76.     /*设置sessionStorage*/
  77.     setSession(key, val) {
  78.         var setting = arguments[0];
  79.         if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
  80.             for(var i in setting){
  81.                 this.ss.setItem(i, JSON.stringify(setting[i]))
  82.             }
  83.         }else{
  84.             this.ss.setItem(key, JSON.stringify(val))
  85.         }
  87.     }
  89.     /*获取sessionStorage*/
  90.     getSession(key) {
  91.         if (key) return JSON.parse(this.ss.getItem(key))
  92.         return null;
  94.     }
  96.     /*移除sessionStorage*/
  97.     removeSession(key) {
  98.         this.ss.removeItem(key)
  99.     }
  101.     /*移除所有sessionStorage*/
  102.     clearSession() {
  103.         this.ss.clear()
  104.     }
  107. }

二.css

1. 公共样式提取

  1. /* 禁止选中文本 */
  2. .usn{
  3.     -webkit-user-select:none;
  4.     -moz-user-select:none;
  5.     -ms-user-select:none;
  6.     -o-user-select:none;
  7.     user-select:none;
  8. }
  9. /* 浮动 */
  10. .fl { float: left; }
  11. .fr { float: right; }
  12. .cf { zoom: 1; }
  13. .cf:after {
  14.     content:".";
  15.     display:block;
  16.     clear:both;
  17.     visibility:hidden;
  18.     height:0;
  19.     overflow:hidden;
  20. }
  22. /* 元素类型 */
  23. .db { display: block; }
  24. .dn { display: none; }
  25. .di { display: inline }
  26. .dib {display: inline-block;}
  27. .transparent { opacity: 0 }
  30. /*文字排版、颜色*/
  31. .f12 { font-size:12px }
  32. .f14 { font-size:14px }
  33. .f16 { font-size:16px }
  34. .f18 { font-size:18px }
  35. .f20 { font-size:20px }
  36. .fb { font-weight:bold }
  37. .fn { font-weight:normal }
  38. .t2 { text-indent:2em }
  39. .red,a.red { color:#cc0031 }
  40. .darkblue,a.darkblue { color:#039 }
  41. .gray,a.gray { color:#878787 }
  42. .lh150 { line-height:150% }
  43. .lh180 { line-height:180% }
  44. .lh200 { line-height:200% }
  45. .unl { text-decoration:underline; }
  46. .no_unl { text-decoration:none; }
  47. .tl { text-align: left; }
  48. .tc { text-align: center; }
  49. .tr { text-align: right; }
  50. .tj { text-align: justify; text-justify: inter-ideograph; }
  51. .wn { /* 强制不换行 */
  52.     word-wrap:normal;
  53.     white-space:nowrap;
  54. }
  55. .wb { /* 强制换行 */
  56.     white-space:normal;
  57.     word-wrap:break-word;
  58.     word-break:break-all;
  59. }
  60. .wp { /* 保持空白序列*/
  61.     overflow:hidden;text-align:left;white-space:pre-wrap;word-wrap:break-word;word-break:break-all;
  62. }
  63. .wes { /* 多出部分用省略号表示 , 用于一行 */
  64.     overflow:hidden;
  65.     word-wrap:normal;
  66.     white-space:nowrap;
  67.     text-overflow:ellipsis;
  68. }
  69. .wes-2 { /* 适用于webkit内核和移动端 */
  70.     display: -webkit-box;
  71.     -webkit-box-orient: vertical;
  72.     -webkit-line-clamp: 2;
  73.     overflow: hidden;
  74. } 
  75. .wes-3 {
  76.     display: -webkit-box;
  77.     -webkit-box-orient: vertical;
  78.     -webkit-line-clamp: 3;
  79.     overflow: hidden;
  80. }
  81. .wes-4 {
  82.     display: -webkit-box;
  83.     -webkit-box-orient: vertical;
  84.     -webkit-line-clamp: 4;
  85.     overflow: hidden;
  86. }
  88. /* 溢出样式 */
  89. .ofh { overflow: hidden; }
  90. .ofs {overflow: scroll; }
  91. .ofa {overflow: auto; }
  92. .ofv {overflow: visible; }
  94. /* 定位方式 */
  95. .ps {position: static; }
  96. .pr {position: relative;zoom:1; }
  97. .pa {position: absolute; }
  98. .pf {position: fixed; }
  101. /* 垂直对齐方式 */
  102. .vt {vertical-align: top; }
  103. .vm {vertical-align: middle; }
  104. .vb {vertical-align: bottom; }
  107. /* 鼠标样式 */
  108. .csd {cursor: default; }
  109. .csp {cursor: pointer; }
  110. .csh {cursor: help; }
  111. .csm {cursor: move; }
  113. /* flex布局 */
  114. .df-sb {
  115.     display:flex;
  116.     align-items: center;
  117.     justify-content: space-between;
  118. }
  119. .df-sa {
  120.     display:flex;
  121.     align-items: center;
  122.     justify-content: space-around;
  123. }
  125. /* 垂直居中 */
  126. .df-c {
  127.     display: flex;
  128.     align-items: center;
  129.     justify-content: center;
  130. }
  131. .tb-c {
  132.     text-align:center;
  133.     display:table-cell;
  134.     vertical-align:middle;
  135. }
  136. .ts-c {
  137.     position: absolute;
  138.     left: 50%; top: 50%;
  139.     transform: translate(-50%, -50%);
  140. }
  141. .ts-mc {
  142.     position: absolute;
  143.     left: 0;right: 0;
  144.     bottom: 0; top: 0;
  145.     margin: auto;
  146. }
  148. /* 辅助 */
  149. .mask-fixed-wrapper {
  150.     width: 100%;
  151.     height: 100%;
  152.     position: fixed;
  153.     left:0;top:0;
  154.     background: rgba(0, 0, 0, 0.65);
  155.     z-index: 999;
  156. }
  157. .bg-cover {
  158.     background-size: cover;
  159.     background-repeat: no-repeat;
  160.     background-position: center center;
  161. }
  162. .bg-cover-all {
  163.     background-size: 100% 100%;
  164.     background-repeat: no-repeat;
  165.     background-position: center center;
  166. }

发表评论

表情：
评论列表 （有 0 条评论，451人围观）

还没有评论，来说两句吧...

相关阅读