Question

我正在创建一个包含两个Youtube视频的网站。这些视频使用Youtube的原始嵌入代码。该网站的设计不适用于任何默认的Youtube尺寸，因此我正在编写代码以自动调整视频大小。这是我的代码。页面上永远不会有这两个标签，否则我会更好地选择视频。

<script language='JavaScript' type='text/javascript'>
var x=document.getElementsByTagName('object');

x.[0].width='350';
x.[0].height='350';
x.[1].width='350';
x.[1].height='350';

</script>

作为参考，这里是一个示例默认的Youtube嵌入代码可能会改变：

<object width="480" height="385">
<param name="movie" value="http://www.youtube-nocookie.com/v/zSgiXGELjbc&hl=en_US&fs=1&rel=0"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube-nocookie.com/v/zSgiXGELjbc&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed>
</object>

在Chrome中，视频播放器可以完美地放在350x350的盒子中。在IE和FF（最新版本）中，视频的大小不变。我在谷歌找不到任何解释为什么这不起作用的内容。我尝试过使用setattribute，for循环，调整单引号和双引号等。

任何想法出了什么问题？

Answer 1

firefox使用'embed'中的值而不仅仅是'object'标记的值 - 可能需要替换两者以确保

Answer 2

首先，您必须写x[0]而不是x.[0]。如果这不起作用，我还有两个想法：

（1）

x[0].width='350px';
x[0].height='350px';
x[1].width='350px';
x[1].height='350px';

（2）

x[0].style.width='350px';
x[0].style.height='350px';
x[1].style.width='350px';
x[1].style.height='350px';

Answer 3

这是x[0].style.width。

宽度，高度，显示等是对象样式的所有属性。

我写x[0].style.width = 350 + px

另请注意，您的对象和嵌入都具有内联指定的维度，并且这些维度可能会覆盖您的JS，具体取决于浏览器/版本。

更改<object>高度和宽度适用于Chrome，但不适用于Firefox或IE。为什么呢？</对象>

3 个答案: