亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

directory search
導(dǎo)論 前言 為什么學(xué)習(xí)JavaScript JavaScript的歷史 基本語(yǔ)法 語(yǔ)法概述 數(shù)值 字符串 對(duì)象 數(shù)組 函數(shù) 運(yùn)算符 數(shù)據(jù)類型轉(zhuǎn)換 錯(cuò)誤處理機(jī)制 JavaScript 編程風(fēng)格 標(biāo)準(zhǔn)庫(kù) Object對(duì)象 包裝對(duì)象和Boolean對(duì)象 Number對(duì)象 String對(duì)象 Math對(duì)象 Date對(duì)象 RegExp對(duì)象 JSON對(duì)象 ArrayBuffer:類型化數(shù)組 面向?qū)ο缶幊?/a> 概述 封裝 繼承 模塊化編程 DOM Node節(jié)點(diǎn) document節(jié)點(diǎn) Element對(duì)象 Text節(jié)點(diǎn)和DocumentFragment節(jié)點(diǎn) Event對(duì)象 CSS操作 Mutation Observer 瀏覽器對(duì)象 瀏覽器的JavaScript引擎 定時(shí)器 window對(duì)象 history對(duì)象 Ajax 同域限制和window.postMessage方法 Web Storage:瀏覽器端數(shù)據(jù)儲(chǔ)存機(jī)制 IndexedDB:瀏覽器端數(shù)據(jù)庫(kù) Web Notifications API Performance API 移動(dòng)設(shè)備API HTML網(wǎng)頁(yè)元素 Canvas API SVG 圖像 表單 文件和二進(jìn)制數(shù)據(jù)的操作 Web Worker 服務(wù)器發(fā)送事件 Page Visibility API Fullscreen API:全屏操作 Web Speech requestAnimationFrame WebSocket WebRTC Web Components HTML網(wǎng)頁(yè)的API HTML網(wǎng)頁(yè)元素 Canvas API SVG 圖像 表單 文件和二進(jìn)制數(shù)據(jù)的操作 Web Worker 服務(wù)器發(fā)送事件 Page Visibility API Fullscreen API:全屏操作 Web Speech requestAnimationFrame WebSocket WebRTC Web Components 開發(fā)工具 console對(duì)象 PhantomJS Bower:客戶端庫(kù)管理工具 Grunt:任務(wù)自動(dòng)管理工具 Gulp:任務(wù)自動(dòng)管理工具 Browserify:瀏覽器加載Node.js模塊 RequireJS和AMD規(guī)范 Source Map JavaScript 程序測(cè)試 JavaScript高級(jí)語(yǔ)法 Promise對(duì)象 有限狀態(tài)機(jī) MVC框架與Backbone.js 嚴(yán)格模式 ECMAScript 6 介紹 附錄 JavaScript API列表
characters

    • image元素

      • alt屬性,src屬性

      • complete屬性

      • height屬性,width屬性

      • naturalWidth屬性,naturalHeight屬性

    • audio元素,video元素

image元素

alt屬性,src屬性

alt屬性返回image元素的HTML標(biāo)簽的alt屬性值,src屬性返回image元素的HTML標(biāo)簽的src屬性值。

// 方法一:HTML5構(gòu)造函數(shù)Image
var img1 = new Image(); 
img1.src = 'image1.png';
img1.alt = 'alt';
document.body.appendChild(img1);

// 方法二:DOM HTMLImageElement
var img2 = document.createElement('img'); 
img2.src = 'image2.jpg';
img2.alt = 'alt text';
document.body.appendChild(img2);

document.images[0].src
// image1.png

complete屬性

complete屬性返回一個(gè)布爾值,true表示當(dāng)前圖像屬于瀏覽器支持的圖形類型,并且加載完成,解碼過(guò)程沒有出錯(cuò),否則就返回false。

height屬性,width屬性

這兩個(gè)屬性返回image元素被瀏覽器渲染后的高度和寬度。

naturalWidth屬性,naturalHeight屬性

這兩個(gè)屬性只讀,表示image對(duì)象真實(shí)的寬度和高度。

myImage.addEventListener('onload', function() {
    console.log('My width is: ', this.naturalWidth);
    console.log('My height is: ', this.naturalHeight);
});

audio元素,video元素

audio元素和video元素加載音頻和視頻時(shí),以下事件按次序發(fā)生。

  • loadstart:開始加載音頻和視頻。

  • durationchange:音頻和視頻的duration屬性(時(shí)長(zhǎng))發(fā)生變化時(shí)觸發(fā),即已經(jīng)知道媒體文件的長(zhǎng)度。如果沒有指定音頻和視頻文件,duration屬性等于NaN。如果播放流媒體文件,沒有明確的結(jié)束時(shí)間,duration屬性等于Inf(Infinity)。

  • loadedmetadata:媒體文件的元數(shù)據(jù)加載完畢時(shí)觸發(fā),元數(shù)據(jù)包括duration(時(shí)長(zhǎng))、dimensions(大小,視頻獨(dú)有)和文字軌。

  • loadeddata:媒體文件的第一幀加載完畢時(shí)觸發(fā),此時(shí)整個(gè)文件還沒有加載完。

  • progress:瀏覽器正在下載媒體文件,周期性觸發(fā)。下載信息保存在元素的buffered屬性中。

  • canplay:瀏覽器準(zhǔn)備好播放,即使只有幾幀,readyState屬性變?yōu)镃AN_PLAY。

  • canplaythrough:瀏覽器認(rèn)為可以不緩沖(buffering)播放時(shí)觸發(fā),即當(dāng)前下載速度保持不低于播放速度,readyState屬性變?yōu)镃AN_PLAY_THROUGH。

除了上面這些事件,audio元素和video元素還支持以下事件。

事件觸發(fā)條件
abort播放中斷
emptied媒體文件加載后又被清空,比如加載后又調(diào)用load方法重新加載。
ended播放結(jié)束
error發(fā)生錯(cuò)誤。該元素的error屬性包含更多信息。
pause播放暫停
play暫停后重新開始播放
playing開始播放,包括第一次播放、暫停后播放、結(jié)束后重新播放。
ratechange播放速率改變
seeked搜索操作結(jié)束
seeking搜索操作開始
stalled瀏覽器開始嘗試讀取媒體文件,但是沒有如預(yù)期那樣獲取數(shù)據(jù)
suspend加載文件停止,有可能是播放結(jié)束,也有可能是其他原因的暫停
timeupdate網(wǎng)頁(yè)元素的currentTime屬性改變時(shí)觸發(fā)。
volumechange音量改變時(shí)觸發(fā)(包括靜音)。
waiting由于另一個(gè)操作(比如搜索)還沒有結(jié)束,導(dǎo)致當(dāng)前操作(比如播放)不得不等待。


Previous article: Next article: