Javascript 检测querystring中的URL更改

我在一个Shopify产品页面上添加了一些脚本，在这里我需要检测在选择产品选项（由Shopify处理）以供进一步使用时发生的URL更改

当使用以下查询参数（问号）选择变体时，会发生URL更改：

Variant 1 - my.shopify.domain/products/product1?variant=1234
Variant 2 - my.shopify.domain/products/product1?variant=5678

我曾尝试添加“hashchange”事件，但后来意识到它只适用于“#”，而这里的情况并非如此

---

我该怎么办？

请将此脚本粘贴到product.liquid文件中

<script>
  var firstTimeUrl = document.URL;
  document.addEventListener('change', function() {
  var currentPageUrl = document.URL;
  var url = new URL(currentPageUrl);
  var isVariantUrl = url.searchParams.get("variant");
  currentPageUrl = isVariantUrl ? currentPageUrl :isVariantUrl;
    if(currentPageUrl && firstTimeUrl != currentPageUrl) {
      firstTimeUrl = currentPageUrl;
      console.log('variant_id: '+isVariantUrl+'')
    }
  });
</script>

var firstTimeUrl=document.URL；
document.addEventListener（'change'，function（））{
var currentPageUrl=document.URL；
var url=新的url（currentPageUrl）；
var isVariantUrl=url.searchParams.get（“变量”）；
currentPageUrl=isVariantUrl？currentPageUrl:isVariantUrl；
if（currentPageUrl&&firstTimeUrl！=currentPageUrl）{
firstTimeUrl=currentPageUrl；
console.log（'variant_id:'+isVariantUrl+''）
}
});

当URL更改时，页面是否实际卸载/重新加载？如果是这样，您将需要编写一些逻辑来检测请求之间的更改。如果没有，那么您可以尝试，尽管成功的机会取决于URL的获取方式changed@RoryMcCrossanURL不会重新加载。它由Shopify的事件侦听器处理。您可以检查此URL作为示例-使用setInterval（）每2秒检查一次（前提是没有服务器调用）？@vivek_23这是一个选项，但当用户选择一个选项并快速添加到购物车或类似的东西时，仍然会出现这样的情况，而脚本获取了错误的数据。@user3884753是否附加单击事件？