在我們頁面的URL中包含着很多信息,包括域名,協議等等這里就不一一介紹了),對於我們開發者而言,使用比較多的就是頁面之間的傳值。為什么要頁面傳值呢?很簡單,當你在瀏覽一個商品頁面的時候你要看到一個商品的具體信息,當你點擊某個圖片的時候,需要告訴后台我點擊的是哪個頁面,對於前端就是說我要知道我點擊的要發送哪個ajax,或者是ajax 的傳參是哪個。
當然我們的方法是比較多的,可以利用cookies,也可以用localstorage。但是殺雞焉用牛刀呢。我們僅僅是要穿一個商品的ID,他可能就是一個兩位的數字,或者一個小小的字符串。所以URL傳值是個不錯的選擇。(https://item.taobao.com/item.htm?spm=a219e.1191392.1111.6.ADZSSq&id=14628943608&scm=1029.newlist-0.1.50002766&ppath=&sku=&ug=#detail)這是淘寶的一個鏈接,其中的ID為商品的ID,獲取頁面id后面的數字,就能知道是哪個商品,就能調取后台的數據,來進行后面一系列的操作。所以我們要截取這段數字。有兩個比較常用的辦法。
方法一:
function getParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return null;
}
這里是用正則的辦法截取字符串,然后再通過unescape的方法,轉義字符串,得到相應的數據。這種方法的優點是簡單,但是不容易自己理解,畢竟正則驗證不是每個人都能理解透的。
方法二:
function GetRequest() {
var url = location.search; //獲取url中"?"符后的字串
var theRequest = new Object();
if(url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for(var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}
這種方法就比較好理解了,雖然代碼量多一點,但是理解起來比較容易。這里返回的theRequest是一個JSON格式,想用誰就直接點上誰就可以了。
說了這么多就是想分享點代碼和方法給大家。但是頁面間的傳值也不是萬能的。比如說他不能傳一個對象,而且在地址欄的傳值是可見的,可能會導致不安全。但是在不考慮前兩者的前提下,用的還是非常的開心的。比如我們現在寫的基於釘釘的HTML。這中傳值就是非常好的,把上面兩個方法寫到公共JS中,誰用誰就調取。very good
17:53:52