常用URL参数操作函数

408 阅读1分钟

说明

  平时项目中需要经常对URL做一些操作,例如获取参数、更新参数、删除参数等,下面把常用的功能简单介绍一下。

URL常用操作

获取参数值

/**获取路由数据
 * 获取url参数值
 * name:要获取值的参数名
 **/
function GetUrlParam(url, name) {
  var isNameExist = url.indexOf(name) > -1;
  var query = url.split("?")[1];
  if (!isNameExist || !query) return "";

  var keyValArr = query.split("&");
  for (var i = 0; i < keyValArr.length; i++) {
    var keyVal = keyValArr[i].split("=");
    if (keyVal[0] == name) {
      return decodeURIComponent(keyVal[1]);
    }
  }
  return "";
}

更新单条参数

/**更新url中的单个参数
 * field:需要更新参数名
 * query:需要更新参数值
 **/
function UpdateSingleUrlParam(url, field, query) {
  var newUrl = url;
  var reg = new RegExp("(^|)" + field + "=([^&]*)(|$)");
  var tmp = field + "=" + query;
  if (url.match(reg) != null) {
    // 已有该参数,就修改值
    newUrl = url.replace(eval(reg), tmp);
  } else {
    // 没有该参数,就新增/追加
    if (url.match("[?]")) {
      newUrl = url + "&" + tmp;
    } else {
      newUrl = url + "?" + tmp;
    }
  }
  return newUrl;
}

删除参数

/**删除url中的参数及其值
 * field:需要删除的参数名
 **/
function DeleteUrlParam(url, field) {
  var newUrl = url;
  // &?用来删除该条表达式紧跟着的&符号
  var reg = new RegExp("(^|)" + field + "=([^&]*)&?(|$)");
  if (url.match(reg) != null) {
    newUrl = url.replace(eval(reg), "");
  }
  // TODO:暂时处理,如果最后一个是&,直接去掉
  if (newUrl[newUrl.length - 1] == "&")
    newUrl = newUrl.slice(0, newUrl.length - 1);
  return newUrl;
}

更新参数

/**更新url参数(删除、修改、新增))
 * url:需要更新参数的url
 * queryArr:需要更新参数名和参数值数组,格式:[{ name:"参数名", value:"参数值" }]
 **/
function UpdateUrlParam(url, queryArr) {
  if (!url) return;
  var len = queryArr.length;
  for (var i = 0; i < len; i++) {
    var value = encodeURIComponent(queryArr[i].value);
    if (IsStringEmpty(value)) url = DeleteUrlParam(url, queryArr[i].name);
    else url = UpdateSingleUrlParam(url, queryArr[i].name, value);
  }
  return url;
}

/* 判断字符串是否为null、undefined、"" */
function IsStringEmpty(str) {
  return str == "" || str == null || str == undefined;
}