一个简单的网站访问JS计数器 刷新1次加1次访问

要实现一个简单的网站访问计数器，每次页面刷新时访问数增加，你可以使用JavaScript结合浏览器的localStorage（如果希望计数在用户的浏览器上持久化）或者仅使用JavaScript变量（如果计数不需要跨会话持久化）。这里，我将提供一个使用localStorage的解决方案，因为它更接近于实际应用中的需求。


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>访问计数器</title>
</head>
<body>
    <h1>页面访问次数: <span id="counter">0</span></h1>

    <script>
        // 尝试从localStorage中获取访问次数
        let count = localStorage.getItem('pageVisitCount') ? parseInt(localStorage.getItem('pageVisitCount'), 10) : 0;

        // 页面加载时，更新计数并显示
        function updateCount() {
            count++; // 计数增加
            localStorage.setItem('pageVisitCount', count.toString()); // 更新localStorage
            document.getElementById('counter').textContent = count; // 更新页面显示
        }

        // 页面加载完成后执行
        window.onload = updateCount;
    </script>
</body>
</html>

这段代码首先尝试从localStorage中获取名为`pageVisitCount`的项。如果该项存在，则将其值（字符串）转换为整数，并存储在`count`变量中。如果不存在，则假设访问次数为0。然后，定义了一个`updateCount`函数，该函数将`count`变量的值增加1，并将新的值存回localStorage。同时，它还会更新页面上显示的访问次数。最后，使用`window.onload`事件确保在页面加载完成后执行`updateCount`函数。这样，每次用户刷新页面时，访问次数都会增加1并显示出来。