FileReader對象的常用方法有哪些？

FileReader對象可以讀取本地存儲的文件。在使用FileReader對象前，需要實例化FileReader()構(gòu)造函數(shù)，示例代碼如下：

var reader=new FileReader ();

上述代碼中，reader就是一個FileReader對象。FileReader對象的常用方法如表所示。

FileReader 對象的常用方法

需要注意的是，無論文件是否讀取成功，讀取文件的方法都不會返回讀取的結(jié)果，而是將讀取結(jié)果存儲到result 屬性中。readAsTextO方法完成后，result 屬性中將包含一個字符串用來表示讀取文件的內(nèi)容;readAsDataURLO方法完成后，result屬性中將包含一個“data:JRL”格式的Base64字符串來表示讀取文件的內(nèi)容。使用FileReader對象讀取文件內(nèi)容的基本語法如下：

reader.readerAsText(File對象);    // 方式1:讀取文本
reader.readAsDataURL(File對象);   // 方式2：讀取圖片的縮略圖

FileReader對象的常用事件如表

由于FileReader對象繼承EventTarget對象，所以表中的事件也可以通過addEventListener()方法來使用。

下面演示如何監(jiān)聽文件讀取成功事件，示例代碼如下：

//將讀取的內(nèi)容顯示到頁面中
reader.onload=function() {  // onload事件在讀取成功時觸發(fā)
div.innerHTML=this.result;  // 將生成的內(nèi)容顯示到頁面的div元素中
  img.src=this.result;      // 將生成的內(nèi)容賦值為img圖片的src
};

上述代碼中，在onload事件中可以訪問讀取結(jié)果this.result。div和img表示用于顯示文件內(nèi)容的DOM對象。