對(duì)url編碼的原因
保證客戶端只使用一種方法向服務(wù)器發(fā)出請(qǐng)求哥桥，使用js對(duì)url進(jìn)行編碼辱匿，再向服務(wù)器提交确虱，保證服務(wù)器得到的數(shù)據(jù)格式是統(tǒng)一的
encodeURI() 對(duì)整個(gè)url進(jìn)行編碼丝里，對(duì)網(wǎng)址中有特殊含義的符號(hào)不會(huì)進(jìn)行編碼; / ? : @ & = + $ , #
encodeURIComponent()對(duì)url的組成部分進(jìn)行編碼，對(duì)上面的符號(hào)也會(huì)進(jìn)行編碼卒蘸。
window.lcoation屬性
-
href當(dāng)前頁面的網(wǎng)址 -
origin來源網(wǎng)站 -
protocol協(xié)議 -
host域名 -
port端口號(hào) -
pathname路徑 -
search鏈接后面跟的參數(shù)
URLSearchParams
接口定義了一些方法處理url查詢字符串
var s = new URLSearchParams(window.location.search) //后面跟的查詢字符串
s.get('newwindow') // 1
還可以使用的相關(guān)方法：
-
append插入一個(gè)新的搜索參數(shù) -
delete從搜索參數(shù)列表里刪除指定的搜索參數(shù)及對(duì)應(yīng)值 -
entries返回一個(gè)iterator可以遍歷所有鍵值對(duì)的對(duì)象 -
getAll以數(shù)組方式返回指定搜索參數(shù)的所有值 -
has返回判斷是否存在此搜索參數(shù) -
keys此對(duì)象包含了鍵/值對(duì)的所有鍵名 -
set設(shè)置一個(gè)搜索參數(shù)的新值雌隅，假如原來有多個(gè)值將刪除其他所有的值 -
sort按鍵名排序 -
toString返回搜索參數(shù)組成的字符串，可直接使用再url上 -
values返回一個(gè)包含鍵/值對(duì)的所有值得iterator對(duì)象
searchParams
url接口的searchParams屬性返回一個(gè)URLSearchParams對(duì)象缸沃，從這個(gè)對(duì)象中能獲取到URL中的GET參數(shù)
var s = new URL('https://www.google.com.hk/search?newwindow=1&safe=strict&rlz=1C1GCEU_zh-CNCN879CN879&ei=GBr6XYu3LtbT-Qapp6CgDw&q=searchParams&oq=searchParams&gs_l=psy-ab.3..0l7j0i10.2257714.2257983..2258368...7.0..0.77.277.4......0....1..gws-wiz.7ZwmIzsB-KY&ved=0ahUKEwiLo9GFmL_mAhXWad4KHakTCPQQ4dUDCAs&uact=5') //后面跟的URL
s.searchParams.get('newwindow') // 1
原生實(shí)現(xiàn)
function searchParam (str) {
let temp
let res = {}
str = str.replace('?', '')
let arr = str.split('&')
arr.forEach( item => {
temp = item.split('=')
res[temp[0]] = temp[1] || null
})
return res
}
