南昌莫非網(wǎng)絡(luò)之Javascript查詢(xún)字符串location.search()使用方法介紹
首先我們介紹location對(duì)像,location是最有用的BOM對(duì)象之一,它提供了與當(dāng)前窗口中加載的文檔有關(guān)的信息,還提供了一些導(dǎo)航功能。事實(shí)上,location對(duì)象是很特別的一個(gè)對(duì)象,因?yàn)樗仁莣indow對(duì)象的屬性,也是document對(duì)象的屬性;換句話(huà)說(shuō),window.location和document.location引用的是同一個(gè)對(duì)象。location對(duì)象的用處不只表現(xiàn)在它保存著當(dāng)前文檔的信息,還表現(xiàn)在它將URL解析為獨(dú)立的片段,讓開(kāi)發(fā)人員可以通過(guò)不同的屬性訪問(wèn)這些片段。南昌網(wǎng)絡(luò)公司技術(shù)人員將通過(guò)下表列出了location對(duì)象的所有屬性(注:省略了每個(gè)屬性前面的location前綴)。
屬性名例子說(shuō)明
hash"#contents"返回URL中的hash(#號(hào)后面跟零或多個(gè)字符),如果URL中不包含散列,則返回空字符串.
host"www.wopwch.cn:80"返回服務(wù)器名稱(chēng)和端口號(hào)(如果有)
hostname"www.wopwch.cn"返回不帶端口號(hào)的服務(wù)器名稱(chēng)
href"http://www.wopwch.cn"返回當(dāng)前加載頁(yè)面的完整URL.而location對(duì)象的toString()方法也返回這個(gè)值.
pathname"/NewsList/"返回URL中的目錄和(或文件名)
port"8080"返回URL中的指定的端口號(hào),如果URL中不包含端口號(hào),則這個(gè)屬性返回空字符串
protocol"http:"返回頁(yè)面使用的協(xié)議,通常是http:或https
search"?id=5"返回URL的查詢(xún)字符串.這個(gè)字符串以問(wèn)號(hào)開(kāi)頭.
雖然通過(guò)上面的屬性可以訪問(wèn)到location對(duì)象的大多數(shù)信息,但其中訪問(wèn)URL包含的查詢(xún)字符
串的屬性并不方便。盡管location.search返回從問(wèn)號(hào)到URL末尾的所有內(nèi)容,但卻沒(méi)有辦法逐個(gè)訪問(wèn)其中的每個(gè)查詢(xún)字符串參數(shù)。為此,南昌網(wǎng)站設(shè)計(jì)公司技術(shù)人員可以像下面這樣創(chuàng)建一個(gè)函數(shù),用以解析查詢(xún)字符串,然后 返回包含所有參數(shù)的一個(gè)對(duì)象:
function getQueryStringArgs(){
//取得查詢(xún)字符串并去掉開(kāi)頭的問(wèn)號(hào)
var qs=(location.search.length>0 ? location.search.substring (1) :"");
//保存數(shù)據(jù)的對(duì)象
var args=();
//取得每一項(xiàng)
varltems=qs .split(“&");
var item=null.
name=null.
value=null;
//逐個(gè)將每一項(xiàng)添加到args對(duì)象中
for (var i=0;i item=items[i]. split(":");
name=decodeURIComponent (item[0]);
value=decodeURIComponent (item [1]);
args[name] =value;
}
return args;
這個(gè)函數(shù)的**步是先去掉查詢(xún)字符串開(kāi)頭的問(wèn)號(hào)。當(dāng)然,前提是location.search中必須要包含一或多個(gè)字符。然后,所有參數(shù)將被保存在args對(duì)象中,該對(duì)象以字面量形式創(chuàng)建。接下來(lái),根據(jù)和號(hào)(&)來(lái)分割查詢(xún)字符串,并返回name=value格式的字符串?dāng)?shù)組。下面的for循環(huán)會(huì)迭代這個(gè)數(shù)組,然后再根據(jù)等于號(hào)分割每一項(xiàng),從而返回**項(xiàng)為參數(shù)名,第二項(xiàng)為參數(shù)值的數(shù)組。再使用decodeURIComponent()分別解碼name和value(因?yàn)椴樵?xún)字符串應(yīng)該是被編碼過(guò)的)。最后,將name作為args對(duì)象的屬性,將value作為相應(yīng)屬性的值。下面給出了使用這個(gè)函數(shù)的示例:
//假設(shè)查詢(xún)字符串是?q=j avascript&num=10
var args=getQueryStringArgs();
alert(args['q"]);//“javascript“
alert(args["num"]);//"l0"
可見(jiàn),每個(gè)查詢(xún)字符串參數(shù)都成了返回對(duì)象的屬性。這樣就極大地方便了對(duì)每個(gè)參數(shù)的訪問(wèn)。
本文**內(nèi)部技術(shù)人員學(xué)習(xí)交流,不得作于其他商業(yè)用途.