在javascript中添加HTML5視頻源？

Question

我爲html5視頻運行以下代碼。

var media; 
function videotr(){ 
    media = document.createElement('video'); 
    media.preload = true; 
    media.id = 'it'; 
    document.getElementById('crop').appendChild(media) 
    return media; 
}     
var div = document.getElementById('crop'); 
$(div).empty(); 
this.image = new videotr(); 
this.image.src = args.src; 

但是，我想實現多個來源的兼容性。如何通過Java腳本添加多個來源？ 我想以正確的方式做到這一點，而不是通過innerHtml。

Answer 1

創建一個新的source元素，並將其附加到video元素：

function addSourceToVideo(element, src, type) { 
    var source = document.createElement('source'); 

    source.src = src; 
    source.type = type; 

    element.appendChild(source); 
} 

var video = document.createElement('video'); 

document.body.appendChild(video); 

addSourceToVideo(video, 'http://upload.wikimedia.org/wikipedia/commons/7/79/Big_Buck_Bunny_small.ogv', 'video/ogg'); 

video.play(); 

下面是它fiddle。