使用JavaScript从干净/SEO友好的url中获取查询字符串参数

Getting query string parameters from clean/SEO friendly URLs with JavaScript

本文关键字:url 获取 查询 参数 字符串 JavaScript SEO 使用      更新时间:2023-09-26

我最近将我的网站切换到使用干净/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不是我的主要语言,所以我不习惯使用数组等,我试图把它变成一个新的函数一直让我头疼。

指针吗?

这样怎么样?当它确定键/值对时,它分割路径并不断移出数组的第一个元素。

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'));

这可以使用诸如router.js之类的库正式完成,但我想使用简单的字符串操作:

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