如何使用 java 腳本從當前 url 獲取多個 url 參數

Question

我有 2 個 html 頁面、電影。html 和單個.html。 I am passing few values from movies.html to single.html through href tag, so it goes along with the url and i can fetch it in single.html page. 下面是代碼：

電影.html：

    <a href="single.html?var1=abc&var2=xyz&var3=def">

所以現在點擊 html 頁面中的這個 href 鏈接后，single.html?var1=abc&var2=xyz&var3=def 整個事情都在 Z572D4E421E5E6B9BC111D815E8A02 中。 我的問題是如何使用 javascript 獲取 var1、var2 和 var3 的值。

我在 single.html 中使用了以下代碼來獲取參數：

  var movieLink1 = window.location.href.split('?var1=')[1];
  var movieLink2 = window.location.href.split('&var2=')[1];
  var movieLink3 = window.location.href.split('&var3=')[1];

output：

  movieLink1 = var1=abc&var2=xyz&var3=def
  movieLink2 = var2=xyz&var3=def
  movieLink3 = var3=def

預期 output：

movieLink1 = abc
movieLink2 = xyz
movieLink3 = def

我沒有得到預期的 output。

基本上 abc、xyz 和 def 是我的應用程序中的電影下載鏈接，所以如果我單擊單個中的 movieLink1 按鈕。應該下載 400p 分辨率的 html 電影，movieLink2 按鈕應該下載 780p 分辨率的電影，movieLink3 按鈕應該下載 1080p 分辨率的電影。 在移動設備上它工作正常，但在筆記本電腦上點擊任何按鈕下載 1080p 分辨率的電影。 我不明白是什么問題，如果有人可以提供幫助，我將非常感激他們。

Answer 1

您可以使用URLSearchParams

const searchParams = new URLSearchParams(window.location.search);

// access var1
const var1 = searchParams.get("var1");

Answer 2

如果您只需要支持現代瀏覽器而不需要支持 Internet Explorer， wiesson推薦的 URLSearchParams 是最流暢的解決方案。

如果您要尋找適用於所有瀏覽器的解決方案，則可以使用match()方法和/var{n}=(\w+)(\W|$)/之類的正則表達式，即索引 1下的搜索結果的捕獲組將包含所需的參數值。

例子：

const movieLink1 = window.location.href.match(/var1=(\w+)(\W|$)/)[1]
const movieLink2 = window.location.href.match(/var2=(\w+)(\W|$)/)[1]
const movieLink3 = window.location.href.match(/var3=(\w+)(\W|$)/)[1]

output：

movieLink1 = abc
movieLink2 = xyz
movieLink3 = def

Answer 3

可以使用這個function來獲取參數

 const url= 'single.html?var1=abc&var2=xyz&var3=def'

    function getparams(url){
        const paramsobj={}

        if(url.includes('&')){
      const urlarray= url.split('?')
     const  parampairs =urlarray[1].split('&')
     parampairs.forEach(p => {
          const nwpair= p.split('=')
          paramsobj[nwpair[0]]=nwpair[1]
     });

    }
    if(!url.includes('&')){
        const urlarray= url.split('#')
          const keyvalue=urlarray[1].split('=')
        const arr=keyvalue
                let i=0
              while(i<arr.length+2) {
               key=keyvalue.shift()      
                value=keyvalue.shift()   
                paramsobj[key]=value
                      i++
              }    
    }
    return  paramsobj

    }
    params=getparams(url)
    console.log(params.var2)