

The code below
(function () {
"use strict";//strict mode
Var video;//video element
Var scale=0.8;//the first frame image and the proportion of source video
Video=$(" # video "). The get (0);//assignment tag
The console. The log ($(" # video "))
Video. AddEventListener (" loadeddata ", function () {//loaded event, call a function
Var canvas=document. The createElement method (" canvas ");//canvas, canvas
Canvas. Width=video. VideoWidth * scale;
Canvas. Height=video. VideoHeight * scale;
Canvas. GetContext (' 2 d) drawImage (video, 0, 0, canvas, width, canvas, height);//draw
Var imgsrc=https://bbs.csdn.net/topics/canvas.toDataURL (" image/PNG ");
Video. SetAttribute (" poster, "imgsrc);
//key step, set up the label poster attribute has a value of base64 canvas drawing after compiling,
})
} ())