使用 JavaScript 從干凈/SEO 友好的 URL 獲取查詢字符串參數

Question

我最近將我的網站切換為使用干凈/SEO 友好的 URL，這導致我在抓取查詢字符串參數時使用的 JavaScript 函數出現了一些問題。

以前我一直在使用這個功能：

function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
        return pair[1];
    }
}
return (false);
}

這事情上工作得很好像這樣，你可能只需要調用getQueryVariable("image")並返回“awesome.jpg”。

我一直在玩indexOf(); 函數嘗試從當前 URL 中獲取相關參數，例如：

var url = window.location.pathname;
var isPage = url.indexOf("page") + 1;

嘗試獲取“page”參數的數組索引號，然后將其加 1 以移動到該值(?page=name > /page/name/)

JavaScript 不是我的主要語言，所以我不習慣使用數組等，而我試圖將其轉換為新函數的嘗試讓我很頭疼。

任何指針？

Answer 1

這樣的事情怎么樣？ 它拆分路徑並在確定鍵/值對時不斷移出數組的第一個元素。

 function getPathVariable(variable) { var path = location.pathname; // just for the demo, lets pretend the path is this... path = '/images/awesome.jpg/page/about'; // ^-- take this line out for your own version. var parts = path.substr(1).split('/'), value; while(parts.length) { if (parts.shift() === variable) value = parts.shift(); else parts.shift(); } return value; } console.log(getPathVariable('page'));

Answer 2

這可以使用諸如router.js 之類的庫正式完成，但我會進行簡單的字符串操作：

const parts = '/users/bob'.split('/')
const name = parts[parts.length - 1] // 'bob'