使用JavaScript计算网页停留时间的代码示例

该资源提供了一段JavaScript代码，用于在网页上实时统计并显示用户在页面上的停留时间。代码简洁明了，适用于初级到中级的前端开发者，通过定时器实现计时功能，并在用户停留一定时间后弹出提示。 在这段代码中，主要涉及到以下JavaScript知识点： 1. **变量声明**： - `var sec`：用于存储秒数。 - `var min`：用于存储分钟数。 - `var hou`：用于存储小时数。 - `var flag`：标记用户是否已经收到过停留时间提示。 2. **定时器**： - `setTimeout("page5678();", 1000)`：设置一个定时器，每1000毫秒（即1秒）调用一次`page5678`函数。这用于定期更新用户在页面上的停留时间。 3. **函数定义**： - `function page5678()`：这个函数是核心计时逻辑，每次被调用时，它会增加秒数，并在秒数达到60时进位到分钟，同样在分钟达到60时进位到小时。同时，当用户停留超过1分钟且`flag`为0时，会弹出提醒。 4. **DOM操作**： - `helpor_net.value = hou + "小时" + min + "" + sec + ""`：这行代码更新了页面中输入框的值，显示用户的停留时间。`helpor_net`是一个输入元素，这里用于展示时间，虽然在实际应用中可能更常见的是使用`<span>`或`<p>`等非交互元素来显示。 5. **条件语句**： - `if (min > 0 && flag == 0)`：这个条件检查用户是否已停留至少1分钟并且尚未收到提醒。如果满足条件，弹出提醒，并将`flag`设为1，防止重复提醒。 6. **事件循环**： - 通过在`page5678`函数的最后再次调用`setTimeout`，形成一个事件循环，持续更新计时。 这段代码虽然简单，但它展示了JavaScript在网页交互和计时方面的基本应用。在实际开发中，可以进一步改进，例如将时间信息存储在本地存储或Cookie中，以便在用户刷新页面后仍然保留计时，或者将统计结果发送到服务器进行分析。同时，为了提高用户体验，可以优化提醒方式，例如使用非侵入性的通知，而不是弹窗。