下面是gpt生成的代码,能跑,但是性能gpt是不考虑的,自行斟酌
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>MP3播放器</title>
</head>
<body><h1>MP3播放器</h1><audio id="audioPlayer" controls><source src="a.mp3" type="audio/mpeg">Your browser does not support the audio element.</audio><div id="subtitleContainer"></div><script>// 读取SRT字幕文件function loadSubtitles() {fetch('a.srt').then(response => response.text()).then(data => {const subtitleContainer = document.getElementById('subtitleContainer');subtitleContainer.innerHTML = '';const subtitleLines = data.split('\n\n');subtitleLines.forEach(line => {if(line==="")return;const subtitleParts = line.split('\n');const startTime = subtitleParts[1].split(' --> ')[0];const text = subtitleParts.slice(2).join('<br>');const subtitleElement = document.createElement('span');subtitleElement.innerHTML = text+",";//subtitleElement.style.display = 'none';subtitleContainer.appendChild(subtitleElement);const audioPlayer = document.getElementById('audioPlayer');audioPlayer.addEventListener('timeupdate', () => {const currentTime = audioPlayer.currentTime;if (currentTime >= convertTimeToSeconds(startTime)) {subtitleElement.style.backgroundColor="rgb(255 243 156)";} else {subtitleElement.style.backgroundColor="";}});});});}// 将时间转换为秒function convertTimeToSeconds(time) {const timeParts = time.split(':');const hours = parseInt(timeParts[0]);const minutes = parseInt(timeParts[1]);const seconds = parseFloat(timeParts[2].replace(',', '.'));return hours * 3600 + minutes * 60 + seconds;}// 加载字幕和音频window.addEventListener('load', () => {loadSubtitles();});</script>
</body>
</html>