<!DOCTYPE html>

<html>

<body>

<h3>演示如何创建 VIDEO 元素</h3>

<p>请点击按钮来创建 VIDEO 元素，该元素将播放 .ogg 文件格式的影片。</p>

<button onclick="myFunction()">试一下</button>

<p id="demo"></p>

<script>

function myFunction()

{

var x = document.createElement("VIDEO");

x.setAttribute("width", "");

x.setAttribute("height", "");

x.setAttribute("controls", "controls");

x.setAttribute("src", "/i/movie.ogg");

document.body.appendChild(x);

document.getElementById("demo").innerHTML = "<b>注释：</b>IE 和 Safari 不支持 .ogg 文件格式。这只是一个例子。如需使其在所有浏览器中运行，您应该在 video 元素中使用 source 元素。";

}

</script>

</body>

</html>

javascript 创建video元素的更多相关文章

  1. javascript和jquery动态创建html元素

    1.javascript创建元素 创建select var select = document.createElement("select");        elect.opti ...

  2. javascript数组操作(创建、元素删除、数组的拷贝)

    这篇文章主要介绍了javascript数组操作,包括创建.元素的访问.元素删除.数组的拷贝等操作,还有其它示例,需要的朋友可以参考下 1.数组的创建 复制代码 代码如下: var arrayObj = ...

  3. JS事件 什么是事件？JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。

    什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户单击 ...

  4. audio和video元素

    目录 [1]HTML元素 audio video source track[2]API 方法 属性 事件 audio专有 前面的话 HTML5新增了两个与媒体相关的标签,让开发人员不必依赖任何插件就能 ...

  5. 用html5的canvas和JavaScript创建一个绘图程序

    本文将引导你使用canvas和JavaScript创建一个简单的绘图程序. 创建canvas元素 首先准备容器Canvas元素,接下来所有的事情都会在JavaScript里面. <canvas ...

  6. jqueyr获取动态创建的元素

    javascript代码是按照代码顺序执行的,所以如果你用某个元素的click事件创建一个元素,id为test,然后在下面$("#test")是无法选择到的. 正确的方法是将在cl ...

  7. jQuery 绑定事件到动态创建的元素上

    在进入主题之前,我们先来看一个前台页面经常用到的功能:点击页面输入框时自动选择其中文本. 很容易想到利用输入框的focus事件,当输入框获得焦点时,再调用jQuery的select()方法. Okay ...

  8. 用javascript实现html元素的增删查改[xyytit]

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 创建删除元素appendChild,removeChild,createElement,insertBefore

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

随机推荐

  1. [转载]ADO.NET中的五个主要对象

    Connection:主要是开启程序和数据库之间的连接.没有利用连接对象将数据库打开,是无法从数据库中取得数据的.Close和Dispose的区别,Close以后还可以Open,Dispose以后则不 ...

  2. Python+OpenCV图像处理（一）——读取显示一张图片

    先在此处先声明,后面学习python+opencv图像处理时均参考这位博主的博文https://blog.csdn.net/u011321546/article/category/7495016/2? ...

  3. 导弹拦截 p1020

    第一问就是求最长不上升子序列的长度,要写O(nlogn)的算法.... 对于这种nlogn的算法,只能求出长度,不能求出具体的序列.这种算法实现过程如下: 我们定义len为到目前为止最长不上升子序列的 ...

  4. Linux 查看端口使用情况

    之前查询端口是否被占用一直搞不明白,问了好多人,终于搞懂了,现在总结下: 1.netstat  -anp  |grep   端口号 如下,我以3306为例,netstat  -anp  |grep   ...

  5. 【移动端】js禁止页面滑动与允许滑动

    禁止页面滑动 通常静止滑动方案:(阻止滑动事件) window.ontouchmove=function(e){ e.preventDefault && e.preventDefaul ...

  6. win7改装 CentOS7，装完后开机，没有引导

    本来系统是win7,安装centos是用U盘启动安装方式安装成功后,发现win7的系统引导不见了.之前用的是centos6.4安装后依然保留win7引导的,到centos7就不行了 解决方法1.使用r ...

  7. win7搭建pyqt4开发环境

    版本 win7 64bit python2.7 https://www.python.org/ftp/python/2.7.13/python-2.7.13.amd64.msi pyqt4 https ...

  8. 【ASP.Net MVC3 】使用Unity 实现依赖注入

    转载于:http://www.cnblogs.com/techborther/archive/2012/01/06/2313498.html 家人身体不太好,好几天没在园子里发帖了. 新项目还是要用M ...

  9. es破解xpack

    环境:OS:CentOS 7elasticsearch:6.5.0 1.vim LicenseVerifier.java package org.elasticsearch.license; impo ...

  10. Docker学习记录--入门了解+安装

    Docker简介 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制, ...