如何获取当前URL查询参数并添加至jQuery GET AJAX请求中

一、提取当前URL的查询参数 #

现代浏览器方案（推荐） #

利用原生URLSearchParamsAPI可以快速解析查询参数，代码简洁且不易出错：

// 从当前URL提取查询字符串（例如 ?id=123&type=demo）
const searchParams = new URLSearchParams(window.location.search);
// 转换为普通JS对象，方便后续使用
const queryParams = Object.fromEntries(searchParams.entries());

执行后queryParams会是包含所有参数的对象，比如{id: '123', type: 'demo'}。

兼容老浏览器方案 #

如果需要适配不支持URLSearchParams的旧浏览器，可以手动解析查询字符串：

function getQueryParams() {
  const params = {};
  const queryStr = window.location.search.slice(1); // 去掉开头的问号
  if (!queryStr) return params;
  
  queryStr.split('&').forEach(pair => {
    const [key, value] = pair.split('=');
    if (key) {
      params[decodeURIComponent(key)] = decodeURIComponent(value || '');
    }
  });
  return params;
}
const queryParams = getQueryParams();

二、将参数添加到jQuery GET请求中 #

直接把解析好的queryParams对象传给AJAX配置的data属性即可，jQuery会自动将其编码并拼接到请求URL后：

// 先获取查询参数
const searchParams = new URLSearchParams(window.location.search);
const queryParams = Object.fromEntries(searchParams.entries());

// 修改后的AJAX请求
$.ajax({
  type: 'GET',
  url: "backend/count",
  dataType: 'text',
  data: queryParams, // 这里传入查询参数对象
  success: function (rsp) {
    // 你的业务处理逻辑
    ...
  }
});

如果用的是兼容老浏览器的解析方法，只需要把获取queryParams的代码换成const queryParams = getQueryParams();即可。

注意：不要直接手动拼接查询字符串到URL后，使用data参数能让jQuery自动处理参数编码，避免出现字符转义错误。

内容的提问来源于stack exchange，提问作者membersound