Javascript 动态更改youtube上的视频id

Javascript 动态更改youtube上的视频id,javascript,jquery,iframe,youtube-api,youtube-javascript-api,Javascript,Jquery,Iframe,Youtube Api,Youtube Javascript Api,我试图用下面的代码显示没有视频的youtube音频,因此我正在更改视频id,但它一次又一次地播放相同的id <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>About</title> <script type="text/javascript"> functio

我试图用下面的代码显示没有视频的youtube音频,因此我正在更改视频id,但它一次又一次地播放相同的id

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>About</title>
         <script type="text/javascript">
          function val1(val)
          {

        document.getElementsByTagName("div")[0].setAttribute("data-video", val);
                            alert(val);


          }

         </script>
    </head> 
    <body onload="val1('WKV_z36pVAk')"> 
    <h3 style="color:#0066dd">Hello</h3>

    <center>


    <div data-video="8IYzyTYucKQ"
         data-autoplay="0"
         data-loop="1"
         id="youtube-audio">
    </div> 

    </center>
    <button>change</button>


    </body> 
    <script src="https://www.youtube.com/iframe_api"></script>
   <script src="https://cdn.rawgit.com/labnol/files/master/yt.js"></script>
    </html>

关于
功能val1(val)
{
document.getElementsByTagName(“div”)[0].setAttribute(“数据视频”,val);
警报(val);
}
你好
改变

不太确定您要创建什么,但这可能会引导您走向正确的方向

您可以使用以下代码以一种骇人的方式重新加载特定元素

function reload(vidId){ <-- Added a parameter
    var container = document.getElementById("youtube-audio");
    container.setAttribute("data-video", vidId); <-- Added line to change data-video
    var content = container.innerHTML;
    container.innerHTML= content;
}

函数重新加载(vidId){您在哪里看到应该设置
数据视频
来更改当前播放的视频?您应该进行API调用,例如:在加载dom:loaded后更改数据属性时要小心;这会很快让人困惑。请运行此程序并检查。您将了解问题,该程序必须使用youtube视频ID,我想更改另一个id,但它不会更改。您可以编辑该问题,使其成为可运行的Javascript/HTML/CSS片段,以便我们可以运行它吗?您好,在哪里传递新的视频id,我下班了。做了一些更改后,重新加载函数现在接受一个参数。此参数将是正在加载的
数据视频
。希望继续我会帮助你的!
<button onclick="reload('8IYzyTYucKQ')">Reload</button> <-- Added the parameter to what the `data-video` should be changed