Javascriptでのローカルファイルの読み込み

FileAPIを使ってローカルファイルの操作ができる。
Fileタイプのinputを用いる。

<input type="file" id="fileId"/>

注意すべきは、fileの実体は配列になっていることである。
ファイルが一つの場合でも、[0]に格納されている。

document.getElementById("fileId").files[0]

ファイルの内容を読み出すためには、FileReaderを用いる。

var fileData = document.getElementById("fileId").files[0];
var reader = new FileReader();
reader.onload = function(evt){
        document.getElementById("text").innerHTML = evt.target.result;
}
reader.readAsText(fileData, "utf-8");

参考

ASCII.jp - FileAPIでブラウザーからローカルファイルを操作