javascript url引數重構
阿新 • • 發佈:2018-12-30
前端開發中經常會對url進行解析加以使用,在此整理下相關需求實現程式碼。
1. 提供url引數,也就是location.search的值如下:
var url = 'http://www.baidu.com?name=xiaohei&bir=1989&sex=men#abc';
2. 將引數解析成此種物件規格:
Object {name: "xiaohei", bir: "1989", sex: "men"}
相應的函式編寫以及呼叫如下:
function analyseUrl(url){
var obj = {},
arr = [];
if (url.indexOf('?') != -1){
var opt = url.split('?');
var str = opt[1];
arr = str.split('&');
var arrLast = arr[arr.length - 1];
if(arrLast.indexOf('#') != -1){
arr[arr.length - 1] = arrLast.substr(0, arrLast.indexOf('#'));
}
for (var i = 0; i < arr.length; ++i){
var para = arr[i].split('=');
obj[para[0]] = para[1];
}
}
return obj;
}
var paraObj = analyseUrl(url);
返回的物件即包含url引數名和對應的引數值,如果僅僅是需要引數資料使用於編碼中,那麼這個物件內容可以滿足對引數的使用需求。
3. 如果需要重構url,需求如對相關引數進行重新賦值,則新增以下步驟:
提供引數對照對映表
var paraList = {"name" : "dahei", "age" : "12", "bir" : "1989"};
對返回的物件進行引數值重構
for(var j in paraList){
paraObj[j] = paraList[j];
}
- 重新拼接url引數字串
var newPara = '';
for(var k in paraObj){
newPara += k + '=' + paraObj[k] + '&';
}
newPara = newPara.substr(0, newPara.length - 1);
至此,便可以構造如下url引數newPara:
name=dahei&bir=1989&sex=men&age=12