URLのパラメータを引き継ぐ

ページアクセス時にURLに付与されているパラメータを、ページ内の特定のリンクに引き継がせたいということがあったので、実装方法をメモ。

サンプルコード

パラメータを引き継がせたいリンクに.js-linkを付与します。

<a href="/" class="js-link">リンクA</a>
<a href="index.html" class="js-link">リンクB</a>
<a href="index.html?key=val" class="js-link">リンクC</a>
<a href="" class="js-link">リンクD</a>

URLのパラメータの値をリンクに追加します。

document.addEventListener('DOMContentLoaded', function () {
  const params = window.location.search;
  const links = document.querySelectorAll('.js-link');
  links.forEach(function(element) {
    element.href = element.href.split('?')[0];
    element.href += params;
  });
});

リンクに既にパラメータがある場合は削除した上で、URLのパラメータを引き継ぐようにしています。
パラメータを引き継ぐデモページ