根据您的最新评论,我希望在 JavaScript 中做一些事情。这是我将设置的一个小 API 来控制此实例中的视频元素。由于视频元素似乎没有 id,因此使用了 getElementsByTagName:
var myVideoController = {};
myVideoController = (function() {
"use strict";
var muted = false;
var module = {
//Grabs video element by tag name and assumes there would only be one if it exists
getVideoElement : function() {
var videoElements = document.getElementsByTagName('video');
var videoElement = null;
if(videoElements[0]) {
videoElement = videoElements[0];
}
return videoElement;
},
/**
* Wrapper to make interacting with html5 video element functions easier.
* @param functionName - name of function to invoke on the video element
* @params - any additional parameters will be fed as arguments to the functionName function
*/
callVideoFunction : function(functionName) {
var videoElement = module.getVideoElement();
var functionArguments = [];
if(videoElement !== null) {
functionArguments = module.getSubArguments(arguments, 1);
if(functionArguments.length > 0) {
videoElement[functionName](functionArguments);
} else {
videoElement[functionName]();
}
}
},
setVideoProperty : function(propertyName, propertyValue) {
var videoElement = module.getVideoElement();
if(videoElement !== null) {
videoElement[propertyName] = propertyValue;
}
},
/* Helper method to grab array of function arguments for callVideoFunction
since the arguments object in functions looks like an array but isn't
so .shift() is not defined */
getSubArguments : function (args, indexFrom) {
var subArguments = [];
for(var i = indexFrom; i < args.length; i++) {
subArguments.push(args[i]);
}
return subArguments;
},
//Pause the video
pauseVideo : function() {
module.callVideoFunction('pause');
},
//Play the video
playVideo : function() {
module.callVideoFunction('play');
},
//Mute/Unmute video
flipVideoMute : function() {
muted = !muted;
module.setVideoProperty('muted', muted);
}
};
return module;
})();
我在http://www.w3.org/2010/05/video/mediaevents.html对其进行了测试,其中 w3 设置了一个 HTML5 视频,其中包含有关 api 使用情况的反馈。我将上面的代码复制到 javascript 控制台并运行如下命令:
//Start video
myVideoController.playVideo();
//Pause video
myVideoController.pauseVideo();
//Restart video
myVideoController.playVideo();
//Mute video
myVideoController.flipVideoMute();
//Unmute video
myVideoController.flipVideoMute();