window.location對象詳解

window.location.href（當前URL）

結果如下：
http://www.myurl.com:8866/test?id=123&username=xxx

window.location.protocol（協議）

結果如下：
http:

window.location.host（域名 + 端口）

結果如下：
www.myurl.com:8866

window.location.hostname（域名）

結果如下：
www.myurl.com

window.location.port（端口）

結果如下：
8866

window.location.pathname（路徑部分）

結果如下：
/test

window.location.search（請求的參數）

結果如下：
?id=123&username=xxx

通常由於業務需要，前端頁面中的某個數據源來源，需要我們去獲取URL的某個參數值。這時封裝一個輸入參數名獲取對應參數值的函數是必不可少的，如下所示：

function getQuery(name) {
  // 正則：[找尋'&' + 'url參數名字' = '值' + '&']（'&'可以不存在）
    let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
    let r = window.location.search.substr(1).match(reg);//substr() 的參數指定的是子串的開始位置和長度，因此它可以替代 substring() 和 slice() 來使用,但是它沒有標准化
    if(r != null) {
      // 對參數值進行解碼
        return unescape(r[2]); 
    }
    return null;
}

// 調用方法，注意需要傳入String類型的數據，輸出結果為String類型
getQuery('id');   // '123'

不過unescape解碼方法已經廢除了。注釋：ECMAScript v3 已從標准中刪除了 unescape() 函數，並反對使用它，因此應該用 decodeURI() 和 decodeURIComponent() 取而代之。

window.location.origin（'?'前邊的URL）

結果如下：
http://www.myurl.com:8866

鏈接：https://www.jianshu.com/p/c9324d237a8e