当前位置:首页 > JavaScript

js实现每过1秒加1

2026-01-31 09:23:53JavaScript

使用 setInterval 实现每秒加1

通过 setInterval 定时器,每隔 1000 毫秒(1秒)执行一次计数操作。

let count = 0;
const timer = setInterval(() => {
  count++;
  console.log(count); // 替换为实际需要的操作
}, 1000);

// 需要停止时调用 clearInterval(timer)

使用 setTimeout 递归实现

通过递归调用 setTimeout 实现更精确的控制,避免 setInterval 可能因任务阻塞导致的计时漂移。

let count = 0;
function increment() {
  count++;
  console.log(count); // 替换为实际需要的操作
  setTimeout(increment, 1000);
}
increment(); // 启动

结合页面显示的完整示例

在 HTML 中显示动态更新的计数:

js实现每过1秒加1

<div id="counter">0</div>
<script>
  let count = 0;
  const counterElement = document.getElementById('counter');
  setInterval(() => {
    count++;
    counterElement.textContent = count;
  }, 1000);
</script>

注意事项

  • 定时器会持续运行,需通过 clearInterval 或条件判断终止。
  • 页面切换时(如单页应用),需清理定时器以避免内存泄漏。

标签: js
分享给朋友:

相关文章

js实现图表

js实现图表

在JavaScript中实现图表通常使用流行的图表库,以下是几种常见的方法和工具: 使用Chart.js Chart.js是一个简单灵活的库,适合快速生成响应式图表。安装方式包括CDN引入或npm安…

js实现瀑布流

js实现瀑布流

实现瀑布流布局 瀑布流布局是一种常见的网页布局方式,常用于图片展示、商品列表等场景。以下是使用 JavaScript 实现瀑布流布局的几种方法。 纯 JavaScript 实现 通过计算元素的位置和…

js实现求导

js实现求导

实现数值求导的方法 在JavaScript中实现求导通常采用数值方法,因为JavaScript不是符号计算语言。以下是常见的数值微分方法: 中心差分法 中心差分法提供较高精度的导数近似:…

js实现图片

js实现图片

图片加载与显示 在JavaScript中,可以通过Image对象动态加载图片。创建实例后设置src属性触发加载,通过onload回调处理加载完成后的操作: const img = new Ima…

js实现上传文件

js实现上传文件

文件上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现文件上传功能。 <input type="file"…

js实现滑动

js实现滑动

实现滑动效果的方法 在JavaScript中实现滑动效果可以通过多种方式完成,以下是几种常见的实现方法: 使用CSS过渡和JavaScript触发 通过CSS定义过渡效果,JavaScript控制触…