使用js修改url地址引數

風靈使發表於2019-04-18

該方法可以修改url的引數。

例如將

  www.baidu.com

修改為

  www.baidu.com?name=123

操作為:

  window.location.href = changeURLArg(window.location.href,'name',123)
function changeURLArg(url,arg,arg_val){
    var pattern=arg+'=([^&]*)';
    var replaceText=arg+'='+arg_val; 
    if(url.match(pattern)){
        var tmp='/('+ arg+'=)([^&]*)/gi';
        tmp=url.replace(eval(tmp),replaceText);
        return tmp;
    }else{ 
        if(url.match('[\?]')){ 
            return url+'&'+replaceText; 
        }else{ 
            return url+'?'+replaceText; 
        } 
    }
}

/**
 * 獲取url裡的引數
 * @param arg 引數名
 * @returns
 */
function getURLString(arg) { 
	var reg = new RegExp("(^|&)" + arg + "=([^&]*)(&|$)", "i"); 
	var r = window.location.search.substr(1).match(reg); 
	if (r != null) 
		return unescape(r[2]);
	return null; 
} 


//呼叫結果如下: 
var url = window.location.href; 
changeURLArg(url, "id", 99); // http://www.csdn.com/?id=99&ttt=3 
changeURLArg(url, "haha", 33); // http://www.csdn.com/?id=99&ttt=3&haha=33

讀取URL中的引數、修改URL引數、動態修改URL replaceState js程式碼

1、讀取URL中的引數值

/*
*獲取URL引數
*/
function GetQueryString(name)
{
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
};

呼叫方法:

var nameVal=GetQueryString("URL上的引數名");

舉例:

瀏覽器地址連上的地址為:

http://www.aazj.cn/pc/meeting/card.html?skinColor=30&gid=-1&userId=566&modid=1133&puid=9

那麼

var userIdVal=GetQueryString("userId")   //值就等於566

2、修改URL引數

//替換指定傳入引數的值,paramName為引數,replaceWith為新值
function replaceParamVal(paramName,replaceWith) {
    var oUrl = this.location.href.toString();
    var re=eval('/('+ paramName+'=)([^&]*)/gi');
    var nUrl = oUrl.replace(re,paramName+'='+replaceWith);
    this.location = nUrl;
window.location.href=nUrl
}

呼叫舉例

瀏覽器地址連上的地址為:

http://www.aazj.cn/pc/meeting/card.html?skinColor=30&gid=-1&userId=566&modid=1133&puid=9

加入希望修改userId的值為333,那麼

replaceParamVal("userId","333")

URL就會變成

http://www.aazj.cn/pc/meeting/card.html?skinColor=30&gid=-1&userId=333&modid=1133&puid=9

3、動態修改URL

var newUrl="新的Url";
var stateObject = 0;
var title="0"
history.replaceState(stateObject,title,newUrl);

相關文章