java url参数值替换_修改url中参数的值

之前都是先取 window.location.href的值 然后取匹配关键字

近日在mdn上面发现了一个简便方法获取url中参数的值.  请点击这个链接找到例子6

或者直接看这段代码(摘自MDN)：

function loadPageVar (sVar) {

return decodeURI(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + encodeURI(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));

}

alert(loadPageVar("name"));

获取到该参数的值,然后 用js的replace去替换吧,目前没有发现其他更好的办法

2016-03-29  今天再次使用到这个 发现一个特别好用的方法:

function updateQueryStringParameter(uri, key, value) {

var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");

var separator = uri.indexOf('?') !== -1 ? "&" : "?";

if (uri.match(re)) {

return uri.replace(re, '$1' + key + "=" + value + '$2');

}

else {

return uri + separator + key + "=" + value;

}

}

这段代码来自 stackoverflow: http://stackoverflow.com/questions/5999118/add-or-update-query-string-parameter

或者参考github上的这个开源项目  https://github.com/sindresorhus/query-string

-------------------------------------分割线-----------------------------------------

但是在使用途中遇到了两个问题:

1,实际上现在我们的需求是如果添加的parameter 的value 为空的时候 就不应该放到url里面,不然看起来特冗余且丑陋,

2,每一次我们都需要添加一个key value 特麻烦,于是将方法做了一个小小的改造,核心还是引用他们的.

1,first step:

辅助方法 不变,获取url中某参数的值,请注意返回的值是解码后的url匹配值:

//辅助方法 获取url中参数的值

function loadPageVar (sVar) {

return decodeURI(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + encodeURI(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));

}

2,second step:

修改url中参数的值,上面原po主没有处理传入参数的值为空的情况,我用最蠢的办法过滤了一下,请注意传入的url是要先解码,因为第一个辅助方法 loadPageVar返回值是解码后的匹配值:

//更新url中的参数,传为空则不会拼接到url中去 ,请注意 该方法传入的uri需要解码,不然会匹配不到

function updateQueryStringParameterNew(uri, key, value) {

//待修改 不严谨

if(value==''||value==null){

var oldValue=loadPageVar(key);

return uri.indexOf('&'+key+'='+oldValue)!=-1?uri.replace('&'+key+'='+oldValue,''):uri.replace(key+'='+oldValue,'');

}

var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");//忽略大小写

var separator = uri.indexOf('?') !== -1 ? "&" : "?";

if (uri.match(re)) {

return uri.replace(re, '$1' + key + "=" + value + '$2');

}

else {

return uri + separator + key + "=" + value;

}

}

3,third step:

一个一个值的传入修改url 特繁琐,咱们先将传入的各个参数丢到一个对象里面,然后去单个处理 最后返回一个url

//将多个参数以对象的方式传入方法,得到最终的url

function handleUrl(parameterObj,url){

var keys=Object.keys(parameterObj);

var localurl=url;

for(var index in keys){

localurl=updateQueryStringParameterNew(localurl,keys[index],parameterObj[keys[index]]);

}

return localurl;

}

在最后 咱们需要引入这三个公共方法 到帮助类里面.然后调用 handlerUrl方法,再强调一次 传入的url

需要解码.不然会匹配不到

参考 ： https://stackoverflow.com/questions/5999118/add-or-update-query-string-parameter