javascript - 附加 html 字符串时，IE 从维度中删除 "%"

Question

我试图创建一个视频元素作为字符串，从变量(也是字符串)设置高度和宽度，我发现 IE9 正在删除尺寸值中的“%”。这是一个简化的示例:

html:

<div id="videoWrap">
</div>

JavaScript:

var height = '100%',
    width = '100%',
    video = '<video id="someId" width="' + width + '" height="' + height + '">' +
            '<source src="http://someSource.com" /></video>';

$('#videoWrap').append(video);

Chrome(或任何其他合适的浏览器)中的结果:

<div id="videoWrap">
    <video id="someId" width="100%" height="100%">
        <source src="http://someSource.com" />
    </video>
</div>

IE 中的结果:

<div id="videoWrap">
    <video id="someId" width="100" height="100">
        <source src="http://someSource.com" />
    </video>
</div>

大家有什么想法吗？

Answer 1

width 和 height 不是您应该如何设计元素的大小样式。这两个属性应该仅指示像素大小。

相反，请正确使用 style="width: 100%; height: 100%;"。