javascript - 使用 localStorage 进行页面计数点击

Question

对于我的一生，我无法弄清楚这个问题，并且想知道是否有人可以提供帮助......

我儿子正在做一些 html 作业。我们正在尝试放置一个页面计数器来计算并显示页面的点击次数。他有一个索引和另外三页。我已将其放在每个页面上:

<div class="page-count">
  <script type="text/javascript">
      if (localStorage.pagecount)
        {
        localStorage.pagecount=Number(localStorage.pagecount) +1;
        }
    else
      {
        localStorage.pagecount=1;
        }
    document.write("You've had "+ localStorage.pagecount + " hits.");
  </script>
</div>

问题是它将所有点击次数一起计数，而不是每页点击次数……我怎样才能让它计算单个页面上的点击次数，而不是总共有多少点击次数？

提前致谢。

Answer 1

localStorage 是域范围内的，其值在整个网站上共享，而不仅仅是该网站上的一个页面。 localStorage 值也仅保存在用户的浏览器中，而不保存在托管您网站的服务器上。如果您正在构建页面计数器，请记住这一点。

如果您使用 localStorage 进行统计，您将仅统计特定用户从特定计算机对该页面的访问情况。

如果这确实是您正在寻找的功能，您可以通过在 pagecount 对象中为每个单独的页面提供一个单独的键来使其发挥作用。

类似于:

// If this is the first time someone has visited your site, you want 
// to check to see if pagecount has been defined.  If not, define the pagecount object.
!localStorage.pagecount ? localStorage.pagecount = {} : '';

var currentPage = window.location.href;
if(localStorage.pagecount[currentPage]){
    localStorage.pagecount[currentPage] = Number(localStorage.pagecount[currentPage]) + 1;
}
else{
    localStorage.pagecount[currentPage] = 1;
}

上面的代码为您的 pagecount 对象提供了您网站上存在的每个页面的键。