网页视频抓取脚本(技术层面来认识HTML5的视频包括video标签的使用)

　　网页视频抓取脚本(技术层面来认识HTML5的视频包括video标签的使用)

　　现在如果要在页面中使用video标签，需要考虑三种情况，支持Ogg Theora或者VP8（如果这东西没毛病）（Opera、Mozilla、Chrome）、支持H.264（Safari、 IE9、Chrome），都没有（IE6、7、8）。好吧，现在我们从技术层面来理解HTML 5视频，包括视频标签的使用，视频对象可以使用的媒体属性和方法，以及媒体事件。

　　Video 标签的使用

　　Video 标签收录

多个属性，例如 src、海报、预加载、自动播放、循环、控件、宽度、高度和内部使用的标签。Video标签中除了可以收录

的标签外，还可以收录

指定视频无法播放时返回的内容。

　　(1) src 属性和海报属性

　　您可以想象 src 属性的用途。和

　　和标签一样，这个属性用于指定视频的地址。海报属性用于指定一张图片，当当前视频数据无效时显示（预览图片）。无效的视频数据可能是正在加载视频，可能是视频地址错误等。

　　（2) 预加载属性

　　这个属性也可以用来理解名称的用途，这个属性用来定义视频是否预加载。该属性具有三个可选值：none、metadata、auto。如果未使用此属性，则默认为 auto。

　　无：不执行预加载。使用这个属性值可能是页面创建者认为用户不期望这个视频，或者可能会减少HTTP请求。

　　元数据：部分预加载。使用这个属性值意味着页面创建者认为用户并不期待这个视频，而是为用户提供了一些元数据（包括大小、第一帧、曲目列表、时长等）。

　　自动：全部预加载。

　　（3) 自动播放属性

　　这是另一个属性，通过查看其名称就知道其有用性。Autoplay 属性用于设置视频是否自动播放。它是一个布尔属性。出现时表示会自动播放，如果去掉则表示不会自动播放。

　　注意HTML中布尔属性的值不是真假。正确的用法是在标签中使用这个属性来表示true。这时候，属性要么没有值，要么它的值总是等于他的名字（这里，自动播放是或）；并且不要在标签中使用这个属性来表示false（这里不要自动播放为）。

　　（4) 循环属性

　　一目了然，loop属性用于指定视频是否循环播放，也是布尔属性。

　　（5) 控制属性

　　Controls 属性用于向浏览器表明页面创建者没有使用脚本生成播放控制器，浏览器需要启用自己的播放控制栏。

　　控制栏必须包括播放暂停控制、播放进度控制、音量控制等。

　　各个浏览器的默认播放控制栏在界面上是不同的。由于我浏览器的奇怪问题，Firefox和Safari的Video标签不正常，所以这两个只能在网上找截图。

　　(6) 宽度属性和高度属性

　　是标签的共同属性，不言而喻。

　　(7) 源标签

　　Source标签用于为媒体指定多个可选择的文件地址（因为audio标签也可以收录

这个标签，所以这里用的是媒体而不是视频），文件地址只能在media标签中选择使用使用 src 属性时。

　　浏览器检查标签指定的视频是否可以按照源标签的顺序播放（可能是视频格式不支持，视频不存在等），如果不能播放就换下一个. 这种方法主要是为了兼容不同的浏览器。Source 标签本身不代表任何意义，不能单独出现。

　　该标签收录

三个属性：src、type 和 media。

　　src 属性：用于指定媒体地址，同video标签。

　　type属性：用于描述src属性指定的媒体类型，帮助浏览器在获取媒体前判断是否支持该类型的媒体格式。

　　媒体属性：用于描述媒体使用的媒体。如果不设置，默认为all，即支持所有媒体。有没有想到标签的媒体属性？一样的，一样的。

　　(8) 一个完整的例子

　　此代码定义页面上的视频。这个视频的预览图就是海报的属性值。它显示浏览器的默认媒体控制栏，预加载视频的元数据，并循环播放。宽度为 900 像素，高度为 240 像素。.

　　视频地址的第一选择是第一个源标签的src属性值，视频类别是Ogg视频，视频编*敏*感*词*是Theora，音频编*敏*感*词*是Vorbis，播放介质是显示器；视频地址的第二选择不再累赘。如果要兼容IE，可以在最后一个source标签后添加Flash播放器的标签集，或者使用一点JavaScript代码。

　　总结

　　以上就是小编介绍的HTML网页插入视频方法的总结。我希望它会对你有所帮助。如果您有任何问题，请给我留言。小编会及时回复您。非常感谢您对 Scripthome 网站的支持！