JavaScript常用工具函数

• JavaScript
  • 获取地址栏相关数据
  • 时间
  • 字符串操作
  • 浏览器操作

JavaScript

获取地址栏相关数据

方法	含义
window.location.href	整个URl字符串(在浏览器中就是完整的地址栏)
window.location.protocol	URL 的协议部分本例返回值:http:
window.location.host	URL 的主机部分本例返回值:tieba.baidu.com
window.location.port	URL 的端口部分如果采用默认的80端口(update:即使添加了:80)，那么返回值并不是默认的80而是空字符本例返回值:”“
window.location.pathname	URL 的路径部分(就是文件地址)本例返回值:/f/index/forumpark
window.location.search	查询(参数)部分除了给动态语言赋值以外，我们同样可以给静态页面,并使用JavaScript来获得相信应的参数值本例返回值:?pcn=电影&pci=0&ct=1&rn=20&pn=1
window.location.hash	锚点本例返回值:#aaaa

获取地址栏参数

/**
 * @param  str 查询字符串 index?name=jack   srt应为name
 */
function getQueryString (str) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
}

将地址栏参数转换为对象

/**
 * @param  url 地址栏的完整地址 如：window.location.href可以获取到  index?name=jack&addr=usa 
 * 返回的结果是 { name:'jack' , addr:'usa' }
 */
 function parseURL(url) {
    var qs = url.split("?");
    qs = qs[1]?qs[1]:"";
    var obj = {}
    if ('string' !== typeof qs || qs.length === 0) {
        return obj;
    }

    var key = [];
    var eq = '='
    var decode = decodeURIComponent;
    qs = qs.split("&")
    var qsLen = qs.length
    for (var i = 0; i < qsLen; ++i) {
        var x = qs[i]
        var idx = x.indexOf('=');
        var k;
        var v;
        if (idx >= 0) {
            k = decode(x.substring(0, idx));
            v = decode(x.substring(idx + 1))
        } else {
            k = x;
            v = ''
        }
        if (key.indexOf(k) === -1) {
            obj[k] = v
            key.push(k)
        } else if (obj[k] instanceof Array) {
            obj[k].push(v)
        } else {
            obj[k] = [obj[k], v]
        }
    }

    return obj

};

将对象的参数拼接到地址栏

/**
 * @param  url 地址栏的完整地址 如：http://192.168.3.88:8080
 * @param  params 是需要拼接到地址后面的对象 如：{ name:'tom' , id:999 }
 * 拼接的结果是 http://192.168.3.88:8080?name=tom&password=abc123
 */
 function toUrl(url, params){
    let paramsArr = [];
    if (params) {
        Object.keys(params).forEach(item => {
            paramsArr.push(item + '=' + params[item]);
        })
        if (url.search(/\?/) === -1) {
            url += '?' + paramsArr.join('&');
        } else {
            url += '&' + paramsArr.join('&');
        }

    }
    return url ;
}

时间

格式化时间

/**
 * 将日期格式化成指定格式的字符串
 * @param date 要格式化的日期，不传时默认当前时间，也可以是一个时间戳
 * @param fmt 目标字符串格式，支持的字符有：y,M,d,q,w,H,h,m,S，默认：yyyy-MM-dd HH:mm:ss
 * @returns 返回格式化后的日期字符串
 */

console.log( formatDate( new Date() , 'yyyy-mm-dd hh:mm:ss' ) );  //2017-17-19 04:17:23

 function formatDate(date, fmt){
    date = date == undefined ? new Date() : date;
    date = typeof date == 'number' ? new Date(date) : date;
    fmt = fmt || 'yyyy-MM-dd HH:mm:ss';
    var obj =
    {
        'y': date.getFullYear(), // 年份，注意必须用getFullYear
        'M': date.getMonth() + 1, // 月份，注意是从0-11
        'd': date.getDate(), // 日期
        'q': Math.floor((date.getMonth() + 3) / 3), // 季度
        'w': date.getDay(), // 星期，注意是0-6
        'H': date.getHours(), // 24小时制
        'h': date.getHours() % 12 == 0 ? 12 : date.getHours() % 12, // 12小时制
        'm': date.getMinutes(), // 分钟
        's': date.getSeconds(), // 秒
        'S': date.getMilliseconds() // 毫秒
    };
    var week = ['天', '一', '二', '三', '四', '五', '六'];
    for(var i in obj)
    {
        fmt = fmt.replace(new RegExp(i+'+', 'g'), function(m)
        {
            var val = obj[i] + '';
            if(i == 'w') return (m.length > 2 ? '星期' : '周') + week[val];
            for(var j = 0, len = val.length; j < m.length - len; j++) val = '0' + val;
            return m.length == 1 ? val : val.substring(val.length - m.length);
        });
    }
    return fmt;
}

formartToDay

export function formartToDay(str) {
  let formatStr = ''
  let date = new Date(str)
  let Y = date.getFullYear()
  let M =
    date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
  let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
  let h =
    date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':'
  let m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
  formatStr = M + '月' + D + '日' + ' ' + h + m
  formatStr = Y + '-' + M + '-' + D
  return formatStr
}

formartToTime

export function formartToTime(str) {
  let formatStr = ''
  let date = new Date(str)
  let Y = date.getFullYear()
  let M =
    date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
  let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
  let h =
    date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':'
  let m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
  let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
  formatStr = Y + '-' + M + '-' + D + ' ' + h + ':' + m + ':' + s
  return formatStr
}

format

export function format(time, type = 1, needSecond = true) {
  let date = time ? new Date(time) : new Date()
  let Y = date.getFullYear()
  let M =
    date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
  let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
  let h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
  let m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
  let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
  switch (type) {
    case 1:
      return `${Y}年${M}月${D}日${h}时${m}分${needSecond ? `${s}秒` : ''}`
      break
    case 2:
      return `${Y}/${M}/${D} ${h}:${m}${needSecond ? `:${s}` : ''}`
      break
    case 3:
      return `${Y}-${M}-${D} ${h}:${m}${needSecond ? `:${s}` : ''}`
      break
    case 4:
      return `${('' + Y).substr(2, 2)}年${M}月${D}日${h}时${m}分${needSecond
        ? `${s}秒`
        : ''}`
      break
    case 5:
      return `${('' + Y).substr(2, 2)}-${M}-${D} ${h}:${m}${needSecond
        ? `:${s}`
        : ''}`
      break
    case 6:
      return `${('' + Y).substr(2, 2)}/${M}/${D} ${h}:${m}${needSecond
        ? `:${s}`
        : ''}`
      break
    case 7:
      return `${('' + Y).substr(2, 2)}/${M}/${D}`
      break
    case 8:
      return `${Y}-${M}-${D}`
      break
    default:
      break
  }
}

字符串操作

去除首尾制定字符

String.prototype.trim = function(tag) {
    if (!tag) { 
        tag = '\\s';
    }else { 
        if (tag == '\\') { 
        tag = '\\\\'; 
    } else if (tag == ',' || tag == '|' || tag == ';' || tag == '@' || tag == '*' || tag == '#' || tag == '￥' || tag == '%' || tag == '$' || tag == '&') { 
            tag = '\\' + tag; 
        }else { 
            tag = '\\s'; 
        } 
    }
    eval('var reg=/(^' + tag + '+)|(' + tag + '+$)/g;'); 
    return this.replace(reg, '');
};


console.log((',,,a,b c ,t, e,,,,,').trim(','));  //a,b c ,t, e

去除全部空格

function trimAll(str, is_global) {
  var result
  is_global = is_global || 'g'
  result = str.replace(/(^\s+)|(\s+$)/g, '')
  if (is_global.toLowerCase() == 'g') {
    result = result.replace(/\s/g, '')
  }
  return result
}

提取字符串里的数字

String.prototype.toNumber= function() { 
    return this.replace(/\D/g, ""); 
}

console.log(('a 2b4n8 u 98 ,y1').toNumber(','));  //248981

提取字符串里的中文

String.prototype.toCN= function() {  
    var regEx = /[^\u4e00-\u9fa5\uf900-\ufa2d]/g;  
    return this.replace(regEx, '');  
}

console.log(('a 2b4中文n8 u 9字符串8 ,y1').toCN(','));  //中文字符串

提取固定个数文本并加省略号 ？

浏览器操作

开启/退出全屏

var launchFullScreen = function (element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
  return true;
}
//退出全屏模式
var exitFullScreen = function () {
  if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
  return false;
}

cookie操作

var CookieUtil={
    path: "/",
    domain: 'demo.j2ee.com',
    add: function(name,val){
        $.cookie(name, val, {expires: 7, path: this.path, domain: this.domain, secure: true});
    },
    remove: function(name){
        $.cookie(name, null,{path: this.path, domain: this.domain});
    },
    get: function(name){
         $.cookie(name,{path: this.path, domain: this.domain});
    }
}