JavaScript獲取URL中參數(shù)querystring的方法詳解
一. 獲取url的querystring參數(shù)
獲取url的querystring參數(shù)的兩種方法如下：
1.1 方法一：正則匹配
//獲取url中的參數(shù)
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", i); // 匹配目標(biāo)參數(shù)
var result = window.location.search.substr(1).match(reg); // 對querystring匹配目標(biāo)參數(shù)
if (result != null) {
return decodeURIComponent(result[2]);
} else {
return null;
}
}
對于 http://localhost/index.html?q1=abc&q2=efg&q3=h 的url，獲取 q1 參數(shù)值的方法如下：
var q1 = getQueryString('q1'); // abc
1.2 方法二：split
function getQueryString() {
var qs = location.search.substr(1), // 獲取url中"?"符后的字串
args = {}, // 保存參數(shù)數(shù)據(jù)的對象
items = qs.length ? qs.split("&") : [], // 取得每一個參數(shù)項,
item = null,
len = items.length;
for(var i = 0; i < len; i++) {
item = items[i].split("=");
var name = decodeURIComponent(item[0]),
value = decodeURIComponent(item[1]);
if(name) {
args[name] = value;
}
}
return args;
}
對于 http://localhost/index.html?q1=abc&q2=efg&q3=h 的url，獲取 q1 參數(shù)值的方法如下：
var qs = getQueryString(); var q1 = qs["q1"]; // abc
用上面兩種getQueryString()方法都能很好地解決獲取url的querystring參數(shù)問題。就此順便整理一下Location對象，方便日后學(xué)習(xí)參考。
二. Location對象的屬性
備注：以 http://localhost:80/dir/index.html?q1=abc&q2=efg&q3=h#anchor 為例：
location的這8個屬性都是可讀寫的。
其中，改變location.href會跳轉(zhuǎn)到新的URL頁面，而修改location.hash會跳到當(dāng)前頁面中錨點位置。
每次修改window.location的屬性（hash除外），頁面都會以新的URL重新加載，并在瀏覽器的歷史紀(jì)錄中生成一條新紀(jì)錄。
三. Location對象的方法
其中，location.assign(url) 的效果跟下列兩行代碼的效果完全一樣：
window.location = url; location.href = url;
位于 location.reload() 調(diào)用之后的代碼可能會也可能不會執(zhí)行，這取決于網(wǎng)絡(luò)延遲或系統(tǒng)資源等因素。因此，最好將 location.reload() 放在代碼的最后一行。
總結(jié)
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能有所幫助，如果有疑問大家可以留言交流。
相關(guān)文章
今天小編就為大家分享一篇解決layer.open后laydate失效的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
這篇文章主要為大家詳細(xì)介紹了微信小程序自定義底部導(dǎo)航，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-11-11
這篇文章主要介紹了JS實現(xiàn)微信 "炸屎"大作戰(zhàn),本文通過實例代碼圖文展示給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-07-07
這篇文章主要介紹了js中如何對url進(jìn)行編碼和解碼問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-11-11
js導(dǎo)出table到excel同時兼容FF和IE示例
js導(dǎo)出table到excel，在百度可以搜索很多的方法，但是其兼容性是相當(dāng)差的，本文制定了一個可以同時兼容FF和IE的方法，感興趣的朋友可以參考下2013-09-09
在?localStorage?中上傳和檢索存儲圖像的示例詳解
這篇文章主要介紹了在?localStorage?中上傳和檢索存儲圖像,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-06-06
下面小編就為大家?guī)硪黄趈s對象,操作屬性、方法詳解。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-08-08
最近開發(fā)了繁體版本的網(wǎng)站，在網(wǎng)上找了一段比較流行的繁簡切換的JS實現(xiàn)了，不過后來卻發(fā)現(xiàn)，有些頁面會卡死，針對這個問題，下面有個不錯的解決方法2014-03-03
javascript面向?qū)ο笾畉his關(guān)鍵詞用法分析
這篇文章主要介紹了javascript面向?qū)ο笾畉his關(guān)鍵詞用法分析,以實例形式分析了在不同場合下this使用中的特性及相關(guān)使用技巧,需要的朋友可以參考下2015-01-01
js獲取iframe中的window對象的實現(xiàn)方法
下面小編就為大家?guī)硪黄狫S獲得iframe中的window對象的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05