js同步歌词
按照你的说法，应该要用到Ajax，对网页中播放器插件进行帧听，然后再对歌词部分进行处理，百度的Mp3就是这样做的。下面就简单的说一下吧材料：歌曲、歌曲对应的歌词（可以是XML，当然也可以是歌词专用格式lrc，随便啦，什么文件都可以）、几条简单的JS语句处理： 1、JSP生成网页的时候，将音乐播放器插件的ID命名为WMA，当然，你可以随便命名，只是这里便于说明。 2、读取XML或LRC内容，利用Ajax加载到id为lrc的div中。并将XML或LRC的每行的歌词存到数组testmp3中(此数组当然是二维数组，数据组分别播放时间与歌词内容)好了，到此，准备工作就做好了，下面就是重点---歌词同步。 3、相关语句：一、定义函数getWMAtime二、利用Interval=setInterval("getWMAtime()",900)，意思就是每隔900毫秒调用getWMAtime这个函数，并将其放入Interval中。如果要用到“上一曲”“下一曲”，可以将其做为了一个函数，将音乐的地址赋给WMA.URL，用WMA.controls.play();播放，用WMA.controls.stop();停止播放，用WMA.controls.pause();暂停播放。改变了音乐地址后，记得用Ajax载入新的歌词！另： getWMAtime函数的内容为读取当前词曲的播放时间当前的播放时间：WMA.controls.currentPosition;歌曲总时间：WMA.currentMedia.duration;读取当前的时候后，与数组中时间项进行对比，相同(由于其它原因，可能会出现不相同的情况，因此则用“>=”)则用Ajax对id为lrc的div进行更改，具体怎么改那就随便你咯，一般就是改变一下指定行的颜色。如果前当播放时间==歌曲总时间，那么就用clearInterval(Interval)，停止Interval继续调用。好了，一个简单的JS的歌词同步播放器就完工啦参考资料：网上查的资料
百度的这个音乐播放器是有代码的,但是这个显示歌词,是直接镶嵌到网页里的.没有单独的代码.它的网页的整个播放器还有歌词的代码是这样的:
</SCRIPT>
<DIV id=Lrc_div>
<DIV id=url_div>歌曲出处：<A id=song_url href="">;
<DIV id=song style="DISPLAY: none">爱情转移</DIV>
<DIV id=singer style="DISPLAY: none">陈奕迅</DIV>
<DIV id=song_div>歌曲试听：<B>爱情转移网搜 MP3 Wang...</B></DIV>
<DIV id=S_div>
<DIV id=player_div>
<OBJECT id=MediaPlayer1 codeBase= type=application/x-oleobject height=68 standby="Loading Microsoft Windows Media Player components..." width=350 align=baseline border=0 classid=CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95>
<embed src="" align="baseline" border="0" width="350" height="68"
type="application/x-mplayer2"
pluginspage=";"
name="MediaPlayer" showcontrols="1" showpositioncontrols="0"
showaudiocontrols="1" showtracker="1" showdisplay="0"
showstatusbar="1" autosize="0"
showgotobar="0" showcaptioning="0" autostart="1" autorewind="0"
animationatstart="0" transparentatstart="0" allowscan="1"
enablecontextmenu="1" clicktoplay="0"
defaultframe="datawindow" invokeurls="0"></embed></OBJECT></DIV>
<DIV id=SongNum_div>
<DIV id=plus_div contentEditable=false onclick="if(!isLoadIf) {window.document.getElementById('plus_a').target='mt';reWin();} else{try_iframe.Controller(event);if(!is_ext_mb) reWin();return false;}"><A id=plus_a contentEditable=false style="CURSOR: hand">放入我的音乐盒</A></DIV>
<DIV id=next_div contentEditable=false style="DISPLAY: none" onclick="try_iframe.Controller(event);return false;"><A id=next_a contentEditable=false style="CURSOR: hand">下一首</A></DIV>
<DIV id=pre_div contentEditable=false style="DISPLAY: none" onclick="try_iframe.Controller(event);return false;"><A id=pre_a contentEditable=false style="CURSOR: hand"?>上一首</A></DIV></DIV></DIV>
<DIV id=Blrc style="CLEAR: both">
<DIV style="BORDER-RIGHT:#b4c2e2 1px solid; BORDER-TOP:#b4c2e2 1px solid; FONT-SIZE: 12px; BORDER-LEFT:#b4c2e2 1px solid; WIDTH: 350px; BORDER-BOTTOM:#b4c2e2 1px solid; TEXT-ALIGN: left">
<TABLE style="BACKGROUND:#eceded" cellSpacing=0 cellPadding=0 width=350>
<TBODY>
<TR>
<TD style="PADDING-RIGHT: 10px; PADDING-LEFT: 10px; FONT-SIZE: 12px; PADDING-BOTTOM: 1px; PADDING-TOP: 5px; TEXT-ALIGN: left"><B>歌词：</B></TD>
<TD style="TEXT-ALIGN: right"></TD></TR></TBODY></TABLE>
<DIV id=LrcShower_div style="OVERFLOW-Y: scroll; BACKGROUND:#fff; OVERFLOW-X: hidden; WIDTH: 350px; LINE-HEIGHT: 20px; HEIGHT: 276px"><BR><BR><BR><BR><BR><BR><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>陈奕迅</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>爱情转移</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>徘徊过多少橱窗住过多少旅馆</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才会觉得分离也并不冤枉</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>感情是用来浏览还是用来珍藏</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>好让日子天天都过得难忘</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>熬过了多久患难湿了多长眼眶</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才能知道伤感是爱的遗产</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>流浪几张双人床换过几次信仰</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才让戒指义无返顾的交换</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>把一个人的温暖转移到另一个的胸膛</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让上次犯的错反省出梦想</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>每个人都是这样享受过提心吊胆</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才拒绝做爱情待罪的羔羊</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>回忆是捉不到的月光握紧就变黑暗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让虚假的背影消失于晴朗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>阳光在身上流转等所有业障被原谅</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>爱情不停站想开往地老天荒需要多勇敢</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>烛光照亮了晚餐照不出个答案</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>恋爱不是温馨的请客吃饭</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>床单上扑满花瓣拥抱让它成长</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>太拥挤就开到了别的土壤</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>感情需要人接班接近换来期望</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>期望带来失望的恶性循环</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>短暂的总是浪漫漫长总会不满</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>烧完美好青春换一个老伴</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>把一个人的温暖转移到另一个的胸膛</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让上次犯的错反省出梦想</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>每个人都是这样享受过提心吊胆</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才拒绝做爱情待罪的羔羊</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>回忆是捉不到的月光握紧就变黑暗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让虚假的背影消失于晴朗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>阳光在身上流转等所有业障被原谅</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>爱情不停站想开往地老天荒需要多勇敢</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>把一个人的温暖转移到另一个的胸膛</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让上次犯的错反省出梦想</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>每个人都是这样享受过提心吊胆</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>才拒绝做爱情待罪的羔羊</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>回忆是捉不到的月光握紧就变黑暗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>让虚假的背影消失于晴朗</FONT></SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>阳光在身上流转等所有业障被原谅</FONT></SPAN><BR><SPAN class=prelrc>爱情不停站想开往地老天荒需要多勇敢</SPAN><BR><SPAN class=nowlrc>你不要失望荡气回肠是为了最美的平凡.......</SPAN><BR><SPAN style="FONT-SIZE: 12px; MARGIN-LEFT: 12px"><FONT color=#000000>Over...</FONT></SPAN><BR><BR><BR><BR><BR><BR><BR><BR></DIV></DIV></DIV>
<DIV id=lrctellall_div style="DISPLAY: none"></DIV>
<DIV id=InP_div><A href="" target=_blank>意见与反馈</A><A style="COLOR:#666666" href="" target=_blank>权利声明</A></DIV><!-- script type="text/javascript" src="js/jslog.js"></script>-->
<SCRIPT>
