简单的网易歌词

最新推荐文章于 2024-07-23 12:36:06 发布

沈忘年

最新推荐文章于 2024-07-23 12:36:06 发布

阅读量309

点赞数

文章标签：前端 html javascript

本文链接：https://blog.csdn.net/ShenWangNian/article/details/130690695

版权

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

* {

margin: 0;

padding: 0;

}

ul {

list-style: none;

overflow: auto;

border: 1px solid red;

width: 400px;

height: 300px;

line-height: 40px;

text-align: center;

padding: 160px 0px;

box-sizing: border-box;

margin: 0 auto;

}

ul::-webkit-scrollbar {

width: 0px;

}

div {

width: 400px;

height: 360px;

border: 1px solid red;

margin: auto;

overflow: hidden;

position: relative;

}

button {

position: absolute;

bottom: 0px;

left: 184px;

}

.red {

color: red;

font-size: 20px;

}

</style>

</head>

<body>

<div>

</div> <audio src="./MP3.mp3" controls></audio>

</body>

var btnList = document.querySelectorAll('button')

var audio = document.querySelector('audio')

var ul = document.getElementById('lyricList')

var lyric =

"[00:00.000] 作词 : 郑浩Z-Hao\n[00:01.000] 作曲 : 郑浩Z-Hao\n[00:02.000] 编曲 : 黄耿楷\n[00:06.000]\n[00:26.198]城南没有你\n[00:32.364]风语诉悲情\n[00:38.559]花落过花开\n[00:44.776]容我一人听曲释怀\n[00:49.570]副歌：\n[00:50.118]人生得意须尽欢一首情歌两难\n[00:57.152]我们为何一别两宽（一拍两散）\n[01:02.471]人生得意须尽欢\n[01:06.343]情味腐烂\n[01:09.500]南北再无孤雁往来\n[01:14.820]人生得意须尽欢倦看烟雨江南\n[01:21.890]梦里无人生还\n[01:27.336]人生得意须尽欢时辰太晚\n[01:34.305]绵绵温情差你时寒\n[01:40.315]\n[02:05.254]城北参透我\n[02:11.506]是你深情期许过\n[02:17.012]人生尚有来处\n[02:20.288]却只剩归途\n[02:23.636]我纵笔争取从容\n[02:28.429]副歌：\n[02:29.236]人生得意须尽欢一首情歌两难\n[02:36.124]我们别再一拍两散\n[02:41.651]人生得意须尽欢情味腐烂\n[02:48.611]字里行间谈离散\n[02:54.051]人生得意须尽欢借旧俗人作伴\n[03:00.932]我懂此情入戏为怀\n[03:06.370]人生得意须尽欢悲歌曲调唱完\n[03:13.304]情话不再相伴\n[03:21.645]人生得意须尽欢烟雨江南\n[03:28.869]梦里无人生还\n[03:34.217]人生得意须尽欢遇你可算晚\n[03:41.157]绵绵温情差你时寒\n[03:49.740]人生得意须尽欢怪情涣散\n[03:56.645]剩我四季贪念爱\n[04:04.582]\n[04:05.860]编曲：黄耿楷\n[04:06.966]录制：银河录音棚\n[04:08.168]后期：巨力猫录音棚";

var list = lyric.split('\n')

var lyricList = []

list.forEach(function (item) {

if (item && item.split(']')[1]) {

var obj = {}

obj.content = item.split(']')[1]

var reg1 = /\[\d{2}/

var reg2 = /:\d{2}/

var reg3 = /\.\d{1}/

var m = item.split(']')[0].match(reg1)[0].replace('[', '')

var s = item.split(']')[0].match(reg2)[0].replace(':', '') * 1

obj.time = item.split(']')[0]