關於html 5，51cto已陸續報道了幾篇關於html 5應用技巧方面的文章，比如《探秘html 5鏈結預取功能》、《html 5 web sockets應用初探》等等，下面我們將介紹乙個簡單的應用，該應用主要使用了html 5中的filereader方法，filereader就是html 5所提供的file api。
在html 5裡，從web網頁上訪問本地檔案系統變的十分的簡單，那就是使用file api。這個file規範說明裡提供了乙個api來表現web應用裡的檔案物件，你可以通過程式設計來選擇它們，訪問它們的資訊。這個file api包括：
◆乙個filelist序列，代表著由本地系統裡選中的單個的檔案組成的陣列。用來選擇檔案的使用者介面可以通過呼叫實現。
◆乙個blob介面，它代表原始二進位制資料，通過blob物件你可以訪問裡面的位元組資料。
◆乙個file介面，它裡面存有檔案的唯讀屬性資訊，像檔名，檔案型別，檔案資料訪問的位址。
◆乙個filereader介面，它提供了讀取乙個檔案的方法，和乙個獲取檔案讀取結果的事件模型。
◆乙個fileerror介面和乙個fileexception物件，它們用來定義這個規範中的錯誤產生條件。
如何使用這個例子：在這個例子中，給出了乙個畫板，你可以從本地檔案系統裡拖拽進去乙個，或者你也可以用檔案選擇框來選擇。例子中，請只選擇檔案，請注意，該例子中並沒有新增檔案過濾和檔案型別檢查。請記住，沒有乙個瀏覽器完全實現了html 5，這個例子需要在支援html 5的瀏覽器上執行，比如firefox3.5以上。
實現file api的主要方法非常的簡單，就像下面：
function imagesselected(myfiles) ;
})(f);
imagereader.readasdataurl(f);
} }
function dropit(e)
選擇在上放置ondrop事件：
這個例子只是演示了拖拽本地檔案到畫板裡，主要是想展示出html 5 file api簡單但又強大的能力。
HTML5 File API改善網頁上傳功能
html 5讓 html 這個一度單純的置標語言煥發出成熟的魅力，使之成為 web 開發者的強力工具。近日w3c又推出乙個新草案 html5 file apwww.cppcns.comi，這個 api 將讓大大改善基於web 的檔案上傳操作，甚至可以實現直接將檔案從桌面拖放至web。該草案使用 np...
HTML5的File API讀取檔案資訊
html結構 div id fileimage div input type file value upload id fileinput p id fileinfo p css樣式 fileimage fileinfojs var fileinput document.getelementbyid...
html5實訓筆記（五）
vue.js是最火的乙個前端框架 vue.js是前端最主流的框架之一，和angular.js 都是單頁面開發 react.js是一套構建使用者介面的框架 只關注檢視層 它不僅便於上手，還便於和第三方庫結合 vue有配套的第三方類庫 可以整合進行製作大型專案 前端的主要工作 主要負責mvc的v這一層 ...