JSFiddle - React, Tailwind, and code Playground

by Twisty

HTML

<div>
  <a href="https://example.com/index.html?adid=1" target="_black">1</a>
  <a href="https://example.com/index.html?adid=2" target="_black">2</a>
  <a href="https://example.com/index.html?adid=3" target="_black">3</a>
  <a href="https://example.com/index.html?adid=4" target="_black">4</a>
  <a href="https://example.com/index.html?adid=5" target="_black">5</a>
  <a href="https://example.com/index.html?adid=6" target="_black">6</a>
  <a href="https://example.com/index.html?adid=7" target="_black">7</a>
  <a href="https://example.com/index.html?adid=8" target="_black">8</a>
</div>

JavaScript

$(function() {
  function getLinkData() {
    var strLinks = localStorage.getItem("links");
    var links = [];
    if (strLinks != null) {
      links = JSON.parse(strLinks);
    }
    return links;
  }

  function saveLinkData(arr) {
    console.log("Saving Data");
    console.log(arr);
    localStorage.setItem("links", JSON.stringify(arr));
  }

  function findLink(h, arr) {
    var result = -1;
    $.each(arr, function(i, v) {
      if (h.toLowerCase() == v.link) {
        result = i;
      }
    });
    return result;
  }

  function saveLinkClick(h) {
    var links = getLinkData();
    var ind = findLink(h, links);
    if (ind >= 0) {
      links[ind].count++;
      links[ind].last = Date.now();
    } else {
      links.push({
        link: h,
        count: 1,
        last: Date.now()
      });
    }
    saveLinkData(links);
  }

  $("a").click(function(e) {
    saveLinkClick(this.href);
    return true;
  });
});