什麼是正確的方式來閱讀video.js中的視頻元素/屬性？

Question

我需要閱讀並修改視頻元素中的一些標籤和屬性，該元素使用video.js作爲播放器。我已經能夠使用getElementsByTagName和getAttribute讀取信息，如下面的代碼所示。但我希望通過video.js（5.6.0）有更簡單/更好/最好的方式來做到這一點。

var video = document.getElementsByTagName('video')[0]; 
var poster = video.getAttribute('poster'); 
var sources = video.getElementsByTagName('source'); 
var tracks = video.getElementsByTagName('track'); 

if (poster != null) 
{ 
    var newposter = addChk(poster, "p"); // generates modified source 
    video.setAttribute('poster', newposter); 
} 

for (var i = 0; i < sources.length; i++) { 
    var s = sources[i].getAttribute('src'); 
    s = addChk(s,"f");     // generates modified source 
    sources[i].setAttribute('src', s); 
} 

for (var i = 0; i < tracks.length; i++) 
{ 
    var s = tracks[i].getAttribute('src'); 
    s = addChk(s, "c");     // generates modified source 
    tracks[i].setAttribute('src', s); 
} 

謝謝。

Answer 1

正如你使用video.js你應該使用它的API。在創建播放器後直接修改視頻元素並不總是按預期工作，如果您使用的是不同的播放技術（如IE8上的Flash），則甚至不會有視頻元素。

var player = videojs('my_player_id'); 

// Get/set poster: 
console.log(player.poster()); 
player.poster('//example.com/poster.jpg'); 

// Get source: 
console.log(player.currentSrc()); 

// Update source: 
player.src({src: '//example.com/video.mp4', type: 'video/mp4'}); 

// Multiple sources: 
player.src([ 
    {src: '//example.com/video.m3u8', type: 'application/x-mpegURL'}, 
    {src: '//example.com/video.mp4', type: 'video/mp4'} 
]); 

要更新曲目，你需要添加for now之前刪除現有的音軌。

// Remove tracks: 
var tracks = player.textTracks(); 
for (i = 0; i<tracks.length;i++) { 
    player.removeRemoteTextTrack(tracks[i]); 
} 
// Add a track 
player.addRemoteTextTrack({ 
    kind: 'captions', 
    src: '//example.com/captions.vtt', 
    srclang: 'is', 
    label: 'íslenska' 
});