前端歌词滚动js代码

以下是一个简单的前端歌词滚动js代码：

// 获取歌词容器
const lyricsContainer = document.getElementById('lyrics-container');

// 获取歌词列表
const lyricsList = document.getElementById('lyrics-list').getElementsByTagName('li');

// 初始化当前歌词索引为0
let currentIndex = 0;

// 歌词滚动函数
function scrollLyrics() {
  // 获取当前歌词元素
  const currentLyric = lyricsList[currentIndex];
  // 将当前歌词元素滚动到歌词容器中间位置
  lyricsContainer.scrollTop = currentLyric.offsetTop - lyricsContainer.offsetHeight / 2;
  // 高亮显示当前歌词
  for (let i = 0; i < lyricsList.length; i++) {
    lyricsList[i].classList.remove('active');
  }
  currentLyric.classList.add('active');
  // 更新当前歌词索引
  currentIndex++;
}

// 每隔1秒滚动一次歌词
setInterval(scrollLyrics, 1000);

需要注意的是，该代码仅实现了歌词的滚动和高亮显示，具体实现还需要根据实际情况进行调整。例如，歌词容器的样式需要设置为固定高度、滚动条隐藏等