
本文教你使用 JavaScript 和 CSS 实现一组 Font Awesome 图标( 元素)每 1.5 秒在白色与红色之间循环切换,并保持过渡动画流畅。核心在于正确选取所有目标元素并统一更新样式。
本文教你使用 javascript 和 css 实现一组 font awesome 图标(`` 元素)每 1.5 秒在白色与红色之间循环切换,并保持过渡动画流畅。核心在于正确选取所有目标元素并统一更新样式。
要让页面中所有社交图标(如 Spotify、Discord、YouTube 等)同步、平滑地在 white 和 red 之间循环变色,关键在于两点:批量选取元素 + 统一应用状态。你原代码中使用 document.querySelector('i') 只获取第一个 标签,因此仅首个图标变色;而应改用 document.querySelectorAll('i') 获取全部匹配元素,并通过 forEach 批量设置颜色。
✅ 正确实现方案(推荐写法)
将以下脚本添加到 HTML 底部(











