Javascript ll他们各自父母的第一个孩子。使用#playlist>div:first child li

$（文档）.ready（函数（）{
var音频；
//隐藏暂停
$（“#暂停”）.hide（）；
initAudio（$（'#playlist>div:first child li'）；
函数初始化音频（元素）{
var song=element.attr（'song'）；
var title=element.text（）；
var artist=element.attr（'artist'）；
//音频对象
音频=新音频（“媒体/”+歌曲）；
//插入音频信息
$（'.artist'）。文本（artist）；
$（'.title'）。文本（title）；
控制台日志（音频）；
$（“#playlist li”）.removeClass（'active'）；
元素addClass（'active'）；
}
//播放按钮
$（“#播放”）。单击（函数（）{
音频播放（）；
$（“#播放”）.hide（）；
$（“#暂停”）.show（）；
showDuration（）；
});
//暂停按钮
$（“#暂停”）。单击（函数（）{
audio.pause（）；
$（'#play'）.show（）；
$（“#暂停”）.hide（）；
});
//下一个按钮
$（“#下一步”）。单击（函数（）{
audio.pause（）；
var next=$（'#playlist li.active'）.next（）；
如果（next.length==0）{
next=$（“#播放列表李：第一个孩子”）；
}
初始化音频（下一个）；
音频播放（）；
showDuration（）；
});
$（“#播放列表li”）。单击（函数（）{
audio.pause（）；
initAudio（$（this））；
$（“#播放”）.hide（）；
$（“#暂停”）.show（）；
音频播放（）；
showDuration（）；
});
//音量控制
$（'#卷'）。更改（函数（）{
audio.volume=parseFloat（this.value/100）；
console.log（音频、音量）；
});
//时间/表演持续时间
函数showDuration（）{
$（音频）.bind（'timeupdate'，function（）{
//分秒必争
var s=parseInt（audio.currentTime%60）；
var m=parseInt（audio.currentTime/60）%60；
如果（s<10）{
s='0'+s；
}
$（'#duration'）.html（m+'：'+s）；
var值=0；
如果（audio.currentTime>0）{
值=数学楼层（（100/音频.持续时间）*音频.当前时间）；
}
$（'#progress'）.css（'width'，value+'%'）；
});
};
var promise=audio.play（）；
如果（承诺！==未定义）{
承诺。然后（=>{
//自动播放开始了！
}).catch（错误=>{
//自动播放被阻止。
//显示“播放”按钮，以便用户可以开始播放。
});
}
});
/**********播放器******/
.clearfix{
明确：两者皆有；
}
.音频播放器{
边缘顶部：20px；
边缘底部：20px；
}
.progressbar集装箱{
显示：内联flex；
宽度：100px；
保证金：0；
位置：相对位置；
顶部：7px；
}
.进度条{
背景色：#c2002d！重要；
}
#音频信息{
文本对齐：居中；
背景颜色：浅灰色；
颜色：#c2002d；
}
输入量{
宽度：95%；
左缘：2%；
-webkit外观：无！重要；
背景：#ccc；
高度：1px；
边缘底部：20px；
}
输入#卷：：-webkit滑块拇指{
-webkit外观：无！重要；
背景：url（/uploads/images/player//knobred.png）无重复中心；
背景尺寸：10px 10px；
宽度：10px；
高度：10px；
光标：指针；
}
#钮扣{
宽度：15%；
显示：块；
/*利润率：15px自动*/
/*左边距：23px*/
/*溢出：自动*/
}
按钮#播放{
宽度：20px；
高度：20px；
背景：url（/uploads/images/player/play.svg）无重复中心；
背景尺寸：15px 15px；
边界：无；
}
按钮#暂停{
宽度：20px；
高度：20px；
背景：url（/uploads/images/player/pause.svg）无重复中心；
背景尺寸：15px 15px；
边界：无；
}
/*按钮#上一个{
宽度：20px；
高度：20px；
背景：url（../images/rev.svg）无重复中心；
背景尺寸：15px 15px；
}*/
#跟踪器{
位置：相对位置；
宽度：5%；
}
#播放列表{
填充内联开始：0px！重要；
}
#播放列表李{
列表样式：无；
光标：指针；
}
.主动{
颜色：#c2002d；
}
#播放列表>li>img{
高度：15px；
浮动：对；
边缘顶部：5px；
光标：指针；
}
a> img{
高度：15px；
浮动：对；
边缘顶部：5px；
光标：指针；
显示：内联块；
}
/*.信息点{
高度：15px；
背景：url（../images/player/info.svg）无重复中心；
光标：指针；
显示：内联块；
}*/
/************播放器结束******/

sfs
- 



somesong.mp3
song2.mp3
song3.mp3

您当前使用的是
li:first child
，但由于每个
li
都有不同的父项，因此它们都是各自父项的
第一个孩子。使用
#playlist>div:first child li


$（文档）.ready（函数（）{
var音频；
//隐藏暂停
$（“#暂停”）.hide（）；
initAudio（$（'#playlist>div:first child li'）；
函数初始化音频（元素）{
var song=element.attr（'song'）；
var title=element.text（）；
var artist=element.attr（'artist'）；
//音频对象
音频=新音频（“媒体/”+歌曲）；
//插入音频信息
$（'.artist'）。文本（artist）；
$（'.title'）。文本（title）；
控制台日志（音频）；
$（“#playlist li”）.removeClass（'active'）；
元素addClass（'active'）；
}
//播放按钮
$（“#播放”）。单击（函数（）{
音频播放（）；
$（'#p