通過js獲得當前頁面路由參數，是一個常用的方法，即使是靜態的html頁面，也可以借此獲得傳來的參數，達到動態頁面一般的效果。
window.location
我們需要用到的就是window.location的幾個屬性，下面從這個簡單的測試代碼中可以看到詳細的用法：
建立一個htm文件，先設置一個全局樣式，為的是清晰地顯示文字
<style>
body{
background-color: #111;
color:#0c0;
font-family: 'Courier New';
font-size: 36px;
}
</style>
下面是js代碼部分
<script> a="<pre>"; //獲取完整的 URL。 a+="n href = " + window.location.href; //獲取 URL 的協議類型。 a+="nprotocol = " + window.location.protocol; //獲取 網址:端口號。 a+="n host = " + window.location.host; //獲取/開頭的帶路徑的文件名。 a+="npathname = " + window.location.pathname; //獲取文件名問號后面的部分（含問號） a+="n search = " + window.location.search; //獲取 URL 最后#號后的部分（含#號） a+="n hash = " + window.location.hash; //獲取 URL 的端口號。 a+="n port = " + window.location.port; a+="n</pre>"; //把上面的結果顯示出來 document.write(a); </script>
保存代碼到一個頁面比如1.htm，我們需要在本地啟動一個模擬的web服務器，比如使用vscode的GoLive插件，在本例中，它啟用的默認web地址是 http://127.0.0.1:5500 ，在其對應的根目錄下建立js目錄，1.htm放在其中，然后我訪問類似這樣的地址即可看到頁面：
http://127.0.0.1:5500/js/1.htm
這是一個普通的靜態頁面地址，我們可以帶上一些參數，形成這樣的地址：
http://127.0.0.1:5500/js/1.htm?id=7&do=ok#first
這是個比較完整的url，他帶有了協議，端口，路徑，參數，還有錨點，已經可以滿足所有動態頁面的應用，我們得到這個結果：
我們可以看到，所有的參數都被解析出來了！
注：當然你也可以直接打開瀏覽器訪問頁面1.htm，而無需啟動模擬的web服務器。顯示的協議是file://開頭的。但是路徑編碼后會比較長不方便看，僅此而已。
總結一下：
window.location.href
獲取完整的 URL：
http://127.0.0.1:5500/js/1.htm?id=7&do=ok#first
window.location.protocol
獲取 URL 的協議類型：
http:
window.location.host
獲取網址和端口號：
127.0.0.1:5500
window.location.pathname
獲取/開頭的帶路徑的文件名：
/js/1.htm
window.location.search
獲取文件名問號后面的部分（含問號）
?id=7&do=ok
window.location.hash
獲取 URL 最后#號后的部分（含#號）
#first
window.location.port
獲取 URL 的端口號。
5500
以上就是js所能獲得的url參數了。方法簡單而用法無窮：
我們可以通過獲取這些屬性，來判斷頁面狀態，做出相應的動作或者交互響應。
我們也可以通過寫入新的數據而使這些屬性發生改變，此時頁面就會跳轉到新的url頁面去了！
