用BroadcastChannel标签页通信实现音乐切换，模拟酷狗音乐

【需求】
1、点击音乐后新开页签，进行播放
2、切换歌曲后，页签不变且不刷新，直接切换歌曲
3、切换歌曲时不自动切换到播放页
（效果见酷狗音乐）

• 音乐列表页

let musicList = document.querySelectorAll('.music-item>.play'); // 获取按钮NodeList
const channel = new BroadcastChannel('music') // 创建BroadcastChannel实例
for (const btn of musicList) { // 循环播放按钮添加点击事件
    btn.addEventListener('click',function(){
        const first = localStorage.getItem('firstPlayTab') // 本地缓存实现判断是否首次打开播放页
        const name = btn.dataset.name // 获取播放歌曲名
        if(!first){ // 播放tab页是否打开
            window.open(`./music.html?name=${name}`,'music') // 首次则新开播放页
        }else{
            channel.postMessage(name) // 发送BroadcastChannel消息
        }
    })
}

• 音乐播放页

const name = getQueryString('name') // 首次打开获取歌曲名
const audio = document.querySelector('audio')
audio.src = `./${name}` // 播放相应歌曲
const channel = new BroadcastChannel('music') // 创建同name实例
channel.addEventListener('message',function(e){ // 监听消息
    document.querySelector('audio').src = `./${e.data}` // 切换歌曲
})
window.onbeforeunload = function(){
    localStorage.removeItem('firstPlayTab') // 网页关闭前删除本地缓存tag
}
window.onload = function(){
    localStorage.setItem('firstPlayTab','1') // 网页加载后添加本地缓存tag
}