js獲取帶#號連結後的引數

俊俊的小熊餅乾發表於2018-09-25
JS

現在許多的主流網站都將`#`大規模用於重要URL中，我們通過正規表示式和window.location.search獲取引數已經行不通了。

一.`#`號是什麼

1.#代表網頁中的一個位置。其後面的字元，就是該位置的識別符號。

2.#是用來指導瀏覽器動作的，對伺服器端完全無用。所以，HTTP請求中不包括#。

3.在第一個#後面出現的任何字元，都會被瀏覽器解讀為位置識別符號。這意味著，這些字元都不會被髮送到伺服器端。

4.單單改變#後的部分，瀏覽器只會滾動到相應位置，不會重新載入網頁。

5.每一次改變#後的部分，都會在瀏覽器的訪問歷史中增加一個記錄，使用”後退”按鈕，就可以回到上一個位置。

二.如何獲取#號後的字串

1.window.location.search:獲取當前URL的`?`號開始的字串

2.window.location.hash:獲取當前URL的`#`後面的字串

三.js程式碼

1.獲取連結後的引數(不帶#號)

getQueryString(name) {
　　 let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    let r = window.location.search.substr(1).match(reg);
    if (r != null) return decodeURIComponent(r[2]);
    return null;
}

2.獲取連結後的引數(帶#號)

getQueryString(name) {
    let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    if(window.location.hash.indexOf("?") < 0){
            return null;
    }
    let r = window.location.hash.split("?")[1].match(reg); 　　
    if (r != null) return decodeURIComponent(r[2]); 
　　    return null; 
}

 3.使用方法

console.log(`name is `,getQueryString(`name`))

 

感謝您的閱讀，如果您覺得閱讀本文對您有幫助，請點一下“推薦”按鈕。本文歡迎各位轉載，但是轉載文章之後必須在文章頁面中給出作者和原文連線。

相關文章