video屬性及操作

video屬性較多，這篇部落格總結一下幾個常用的，然後再寫乙個例子練習一下。

video api

var video = document.

queryselector
("#video"
);

video.src =

"./mp4/mov_bbb.mp4"
;

video.

onloadstart
=function()
video.
onloadeddata
=function()

video.

oncanplay
=function()

video.

onerror
=function()

video.

onplay
=function()

video.

onpause
=function()

video.

onvolumechange
=function()

video.

onplaying
=function()

video.

ontimeupdate
=function()

var getlocation = document.

queryselector
("#getlocation");
getlocation.
onclick
=function()
else
}function
getlocation
(position)
function
error
(error)

<

!doctype html>
"en"
>
"utf-8"
>
<
/title>
*.block 
#video 
.items 
.play 
.items > span 
.prog 
.btn 
.range 
#volume 
.bigsc 
<
/style>
<
/head>
="block"
>
"video"
>
<
/video>
="items"
>
="play" data-play=
"play"
>play<
/button>
="nowtime"
>0:
00<
/span>
/<
/span>
="alltime"
>0:
00<
/span>
="range" type=
"range" value=
"0" max=
"100"
>
"volume" data-volume=
"0">靜音<
/button>
"bigsc"
>全屏<
/button>
="prog"
>
="btn" style=
"left:-5px;"
>
<
/div>
<
/div>
<
/div>
<
/div>
var video = document.
queryselector
("#video");
var play = document.
queryselector
(".play");
var alltime = document.
queryselector
(".alltime");
var nowtime = document.
queryselector
(".nowtime");
var btn = document.
queryselector
(".btn");
var prog = document.
queryselector
(".prog");
var range = document.
queryselector
(".range");
var volume = document.
queryselector
("#volume");
var bigsc = document.
queryselector
("#bigsc");
var sound =0;
video.src =
"./mp4/mov_bbb.mp4"
; video.
onloadeddata
=function()
video.
ontimeupdate
=function()
video.
onended
=function()
play.
onclick
=function()
else
this
.setattribute
("data-play"
, status)
;this
.innerhtml = status;
}//進度條
prog.
onmousedown
=function
(e) btn.
onmousedown
=function
(e)//處理事件冒泡
e.stoppropagation()
;}window.
onmouseup
=function
(e)//條音量的
range.
onmousedown
=function()
this
.onmouseup
=function()
}//設定靜音
volume.
onclick
=function()
else
this
.setattribute
("data-volume"
, volumesound);}
//全屏**
bigsc.
onclick
=function()
else
if(video.webkitrequestfullscreen)
else
if(video.mozrequestfullscreen)
else
}//換算的方法
function
method
(time)
function
htime
(x)<
/script>
<
/body>
<
/html>

html5 4 2 video元素的屬性

支援的瀏覽器有 firefox opera chrome 支援的瀏覽器有 ie9 chrome safari 雖然目前應用較廣，單有專利保護，是收費在 支援的瀏覽器有 chrome opera safari video元素的屬性 屬性屬性值 描述src urlwidth 正整數 百分比 height...

JQuery dom屬性操作 節點遍歷及包裹

jquery中對dom屬性的操作和遍歷節點。1.attr 屬性操作 attr 的作用是獲取屬性和設定屬性。1 當為該方法傳遞乙個引數時,即為某元素的獲取指定屬性。2 當為該方法傳遞兩個引數時,即為某元素設定指定屬性。3 jquery 中有很多方法都是乙個函式實現獲取和設定.如 attr html t...

列表 list 操作方法及屬性

儲存5個人的年齡,求他們的平均年齡 age1 18 age2 19 age3 20 age4 21 age5 22 思考 要儲存100個人的年齡 解決 使用列表 本質 是一種有序的集合 建立列表 格式 列表名 列表選項1,列表選項2.列表選項n list1 1,2,3,4,5,4,3,2,1,a x...