首先在一些情況下，往url上拼接請求參數(shù)

     【?】開頭     

     【&】開頭  

     【=】參數(shù)值

1.如何直接往url上拼接請求參數(shù)

通過下面的例子可以看出，第一個參數(shù)需要以【?】開頭， 然后是參數(shù)名，然后是【=】，然后是參數(shù)值。

第一個參數(shù)：需要以【?】開頭，然后是參數(shù)名。

http://www.taohua.com?age=1

下面是第二個參數(shù)的拼接開始則需要以【&】開頭，然后是參數(shù)名，然后是【=】，然后是參數(shù)值。

第二個參數(shù)  ： 開始需要以【?】開頭，然后是參數(shù)名，第二個以【&】開頭，然后是參數(shù)名。

http://www.桃花.com?box=arr&anme='桃花'&age=18

這就是url拼接參數(shù)的格式要求。

另一種理解就是，當需要往url上拼接請求參數(shù)的時候，需要以【?】作為分隔符，在【?】分隔符的右邊開始拼接參數(shù)對，參數(shù)對的格式是【參數(shù)名=參數(shù)值】，不同參數(shù)對之間以【&】作為分隔符。

2.js 地址欄url 傳一個參數(shù)和多個參數(shù)時拼接方法：

//動態(tài)設(shè)置當參數(shù)傳進去

let ipaddr = "192.162.1.1.....";
let path = "/arrg/box";
let url   = "http://" + ipaddr +path ;
console.log(url);// http://192.168.1.1..../arrg/box"

//?拼接一個參數(shù)

let ipaddr = "192.162.1.1.....";
let path = "/arrg/box";
let url   = "http://" + ipaddr +path ;
let getTimestamps = new Date().getTime();//時間戳
let url= "http://" + ipaddr + path + "?timestamps=" + getTimestamps;
console.log(url);//http://192.168.1.1..../arrg/box?timestamps=16082771588

//兩個參數(shù)拼接時用 & 連接

let ipaddr = "192.162.1.1.....";
let path = "/arrg/box";
let url= "http://" + ipaddr + path + "?timestamps=" + getTimestamps;
let value = 0;
let url2 = "http://" + ipaddr + path + "?value=" + v + "&timestamps=" + getTimestamps;
console.log(url2);// http://192.168.1.1..../arrg/box?value=0&timestamps=16082771588

補充知識：url獲取?后面所有拼接的參數(shù)

在頁面?zhèn)髦档臅r候,經(jīng)常使用到方法就是url后面通過?拼接參數(shù),再結(jié)合&可以實現(xiàn)多個參數(shù)的傳遞,例如

http://www.test.com?a=123&b=xyz&b=456

傳參不難,只需要按照格式拼接起來,難點在于如何獲取拼接好的參數(shù),以上面為例,也就是獲取?a=123&b=xyz&c=456這部分內(nèi)容

使用window.location.search！對，原生的這個api可以獲取到?以及后面的參數(shù)值，但是不友好的地方在于獲取的是字符串，給我們這么一坨東西沒用啊，我們需要的東西在這字符串之中，所以我們需要處理一下這個字符串，處理成什么格式做好用呢？對象！

因為在js中，萬物皆對象~這里就給大家羅列兩種方法（當然不止兩種，還有很多方式可以處理，找到一兩種好理解，好記憶，靈活處理各種問題的方法才是硬道理）

推薦方法

使用replace()和queryString.parse();

replace()方法可以使用其他的代替,目的是去掉字符串中的?

// http://www.test.com?a=123&b=xyz&b=456
//先引入
import queryString from 'querystring';
 
const url=window.location.search;
const data=url.replace('?', '');
const param = queryString.parse(data);
 
//最后結(jié)果
param = {
    a:'123',
    b:['xyz','456']
}
 
//合并
const param= queryString.parse(url.replace('?', ''));

總結(jié)

到此這篇關(guān)于前端url拼接參數(shù)格式&?用&和? =拼接的文章就介紹到這了,更多相關(guān)url用&和? =拼接內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論