如何在sample.js中获取引入时携带的ts、id参数？location.href为何无效？

当然可以在sample.js里拿到ts和id参数！你之前用window.location.href失败是因为它返回的是当前页面的URL，不是脚本自身的加载地址。下面给你两种实用的实现方案：

方法一：使用document.currentScript（推荐，现代浏览器友好） #

现代浏览器（Chrome、Firefox、Edge等）都支持document.currentScript，它能直接返回当前正在执行的<script>元素，我们可以通过它的src属性拿到脚本的完整URL，再用URL对象解析参数：

// sample.js 中的代码
const currentScript = document.currentScript;
if (currentScript) {
  // 用URL对象解析脚本地址
  const scriptUrl = new URL(currentScript.src);
  // 获取指定参数
  const ts = scriptUrl.searchParams.get('ts');
  const id = scriptUrl.searchParams.get('id');
  
  // 测试输出
  console.log('ts参数值:', ts); // 会输出 123456789
  console.log('id参数值:', id); // 会输出 31ade2
}

这个方法简洁直接，不需要额外的遍历逻辑，是现代项目的首选方案。

方法二：遍历页面中的script元素（兼容老浏览器） #

如果你的项目需要兼容IE这类不支持document.currentScript的老浏览器，可以用遍历的方式：因为同步加载的脚本是按顺序执行的，当脚本运行时，它一定是页面中最后一个被加载的<script>元素，我们可以通过这个特性定位到当前脚本：

// sample.js 中的代码
function getCurrentScriptParams() {
  // 获取页面所有script元素
  const allScripts = document.getElementsByTagName('script');
  // 取最后一个，就是当前正在执行的脚本
  const currentScript = allScripts[allScripts.length - 1];
  // 解析URL参数
  const scriptUrl = new URL(currentScript.src);
  
  return {
    ts: scriptUrl.searchParams.get('ts'),
    id: scriptUrl.searchParams.get('id')
  };
}

// 使用方法
const params = getCurrentScriptParams();
console.log('ts:', params.ts, 'id:', params.id);

小提示 #

URL对象的searchParams方法是ES6引入的，它能帮我们快速解析URL参数，不用自己写正则或者字符串分割的逻辑，非常省心。如果需要兼容极老的环境，也可以自己实现一个简单的参数解析函数，但一般现代项目用URL对象就足够了。

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