浏览器里怎么快速生成带参数的动态链接

平时上网的时候，你有没有遇到过这种情况：想把某个网页内容分享给别人，但又希望对方打开时能自动带上你的推荐码、来源标记，或者跳转到特定页面？这时候普通的静态链接就不够用了，得靠动态链接生成来搞定。

什么是动态链接生成

简单说，动态链接就是在原始网址后面加上一些自定义参数，让链接“活”起来。比如你常看到的 https://example.com?from=weixin&user=123，后面的 ?from=weixin&user=123 就是动态部分，服务器可以根据这些信息做不同处理。

手动拼接太麻烦？用浏览器快速生成

很多人习惯复制基础链接再手动加参数，容易出错还费时间。其实利用浏览器的书签功能，可以一键生成动态链接。

比如你想每次分享知乎文章时都自动加上自己的邀请码，可以新建一个书签，名字叫“生成邀请链接”，网址填下面这段代码：

javascript:(function(){
  const url = window.location.href;
  const shareLink = url + '?invite_code=your123';
  prompt('生成的动态链接：', shareLink);
})();

保存后，下次打开任意知乎文章页面，点击这个书签，就会弹出带 invite_code 的新链接，复制就能发出去。

更灵活的场景：根据页面内容生成链接

有些时候你想生成的链接不只是加个参数那么简单。比如你在看商品页，想生成一个带价格提醒的跳转链接。

可以这样写书签脚本：

javascript:(function(){
  const title = document.title;
  const price = document.querySelector('.price')?.innerText || '未知';
  const link = `https://yourbot.com/alert?item=${encodeURIComponent(title)}&price=${price}`;
  navigator.clipboard.writeText(link).then(()=>{
    alert('已复制动态提醒链接！');
  });
})();

点一下就自动提取标题和价格，生成专属提醒链接并复制到剪贴板，发给朋友或自己存着都方便。

小技巧：多个参数怎么处理

参数一多，手写容易乱。建议用 URLSearchParams 来管理：

javascript:(function(){
  const params = new URLSearchParams();
  params.set('source', 'browser');
  params.set('version', '2');
  params.set('page', document.title.slice(0, 20));
  
  const finalUrl = 'https://example.com/track?' + params.toString();
  console.log(finalUrl);
  prompt('生成链接：', finalUrl);
})();

这样参数清晰，增删改都方便，也不会因为特殊字符导致链接出错。

这些方法不依赖任何外部工具，只要浏览器就能用。你甚至可以把不同的生成逻辑做成多个书签，按需使用。试试看，你会发现很多重复操作都能省下来。