Dodawanie źródeł do wideo HTML5 w javascript?

Question

Mam następujący kod dla wideo 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; 

Chciałbym jednak wprowadzić wiele źródeł kompatybilności. Jak dodać wiele źródeł za pomocą skryptu Java? Chcę to zrobić we właściwy sposób, nie poprzez innerHtml.

Answer 1

Utwórz nowy source elementu i dołączyć go do elementu 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(); 

Oto fiddle dla niego.