JS实现网页手机音乐播放器歌词同步播放功能代码

//获取歌词文本   var txt = document.getElementById("lrc");   var lrc = txt.value;//获取文本域里的值   /*console.log(lrc);*/   var lrcArr = lrc.split("[");//去除[   /*console.log(lrcArr);*/   var html = "";//定义一个空变量保存文本   for(var i=0 ; i<lrcArr.length ; i++)   {     var arr = lrcArr[i].split("]");     /*console.log(arr[1]);*/     var allTime = arr[0].split(".");     var time = allTime[0].split(":");     //获取分钟 秒钟 把时间换算成秒钟     var timer = time[0]*60 + time[1]*1；     var text = arr[1];     if(text)     {       html += "<p id="+timer+">"+text+"</p>"     }     con.innerHTML = html     <pre class="html" name="code">}</pre>   <pre></pre>   <p></p>   <p>实现歌词同步首先要获取到文本框 再配合H5中新增的属性如图 其实很简单啦！</p>   <p></p>   <p><pre class="html" name="code">    //监听音乐播发进度实现歌词同步   myMusic.addEventListener("timeupdate",function(){     //获取当前播放时间     var curTime = parseInt(this.currentTime)；     if(document.getElementById(curTime))     {       for(var i=0 ; i<oP.length ; i++)       {   oP[i].style.cssText = "color:#ccc;font-size:12px;";       }       document.getElementById(curTime).style.cssText="color:rgb(242,110,111);font-size:18px;";       if (oP[num+7].id == curTime)//判断成功一次num++       {   con.style.top = -20*num +"px";   num++;       }     }   });</pre></p>   <pre></pre>

如何用html5 写出网页音乐播放器

html网页音乐播放器自带播放列表_PHP教程

html网页音乐播放器自带播放列表

以上就是JS实现网页手机音乐播放器歌词同步播放功能代码的详细内容，更多内容请关注技术你好其它相关文章！