JSFiddle - React, Tailwind, and code Playground

HTML

例えばこんなリンクがあったとして<a href="" data-pc="pc-link-a" data-mobile="mobile-link-a" class="amazon-link">item-A</a>リサイズするとリンクの中身が変わります。
<a href="" data-pc="pc-link-b" data-mobile="mobile-link-b" class="amazon-link">item-B</a>違うリンク

JavaScript

(function($) {
	
  var changelink_width = 480; //default: 480

  var deb = function(object, eventType, callback) {
    var timer;
    object.addEventListener(eventType, function() {
      clearTimeout(timer);
      timer = setTimeout(function() {
        callback();
      }, 100);
    }, false);
  };

  var changelink = function() {
    $(".amazon-link").each(function() {
      var mobile = $(this).data("mobile"),
        pc = $(this).data("pc");
      if (window.innerWidth < changelink_width) {
        $(this).attr("href", mobile);
      } else {
        $(this).attr("href", pc);
      }
    });
  };

  //画面読み込み時 リサイズ時に変更タイプ
  $(function() {
    changelink();
  })
  deb(window, "resize", function() {
    changelink();
  });
})(jQuery);

//
//-----表示以下確認用で不要
//
(function($) {
  var deb = function(object, eventType, callback) {
    var timer;
    object.addEventListener(eventType, function() {
      clearTimeout(timer);
      timer = setTimeout(function() {
        callback();
      }, 100);
    }, false);
  };

  var checkview = function() {
    if ($("ul").find("li").length) {
      $("ul").empty();
    }
    $(".amazon-link").each(function() {
      var str = $(this).text(),
        href = $(this).attr("href"),
        links = "<li>" + str + ": " + href + "</li>";
      $("ul").append(links);
    });
  };
  $(function() {
    $("body").append("<ul>");
    checkview();
  });
  deb(window, "resize", function() {
    checkview();
  });
})(jQuery);