使用javascript检索嵌入式视频的宽度_Javascript_Css

使用javascript检索嵌入式视频的宽度

javascript css

使用javascript检索嵌入式视频的宽度,javascript,css,Javascript,Css,我有一个嵌入视频的简单页面。下面是一个例子。我想检索嵌入视频的iframe的宽度，它可能会有所不同（例如，如果视频来自youtube或vimeo）。然后我可以在它旁边放一个div和一些文本，并相应地调整后者的宽度 <html> <head> </head> <body onLoad = "resizeElements()"> <iframe width="420" height="315" src="http://

我有一个嵌入视频的简单页面。下面是一个例子。我想检索嵌入视频的iframe的宽度，它可能会有所不同（例如，如果视频来自youtube或vimeo）。然后我可以在它旁边放一个div和一些文本，并相应地调整后者的宽度

<html>
  <head>
  </head>
      <body onLoad = "resizeElements()">
    <iframe width="420" height="315" src="http://www.youtube.com/embed/a34QTcpnKww"     frameborder="0" allowfullscreen>
    </iframe>  
  </body>
    <script language="JavaScript" type="text/javascript">
    function resizeElements() 
    {
      var iframeVideos = document.getElementsByTagName("iframe");
      for ( var i = 0; i < iframeVideos.length; i++) 
      {
        video = iframeVideos[i];
        alert ( ">" + video.style.width+ "<" );
        video.style.width = "112px";
        video.style.height = "63px";
        alert ( ">" + video.style.width+ "<" );
      }
    }
  </script>
</html>


函数resizeElements（）
{
var iframeVideos=document.getElementsByTagName（“iframe”）；
对于（var i=0；i”+video.style.width+“+video.style.width+”DOM:element.offset*
而且应该有帮助
我认为您只需要设置样式属性以匹配宽度和高度属性：
<iframe style="width:420;height:315" width="420" height="315" src="http://www.youtube.com/embed/a34QTcpnKww"     frameborder="0" allowfullscreen>
    </iframe>



因为在你的函数中，你使用的是style属性。
1。这是一个hacky。2.iframe代码来自Youtube/Vimeo/等，所以他无法更改它。嗨，谢谢你的回答！很明显，我没有注意到没有“style”“属性。我不知道你也可以调用object.width而不是object.style.width。我试过了，它可以工作：）我会坚持这一点，因为一些对html一无所知的用户可能会添加视频，而要求他们编辑嵌入的代码也会有点要求。”much@Dan不是在所有HTML对象上。
 alert ( ">" + video.width +  "<" );
 alert ( ">" + video.getAttribute(width) +  "<" );

<iframe style="width:420;height:315" width="420" height="315" src="http://www.youtube.com/embed/a34QTcpnKww"     frameborder="0" allowfullscreen>
    </iframe>