上传文件

HTML5新增了文件API,提供客户端本地操作文件的可能.

我们可以通过file表单或拖放操作选择文件,还可以通过JavaScript读取文件的名称、大小、类型、和修改时间.

file类型的input表单新增了files属性,保存我们上传文件的信息,如果要实现多文件上传,可以设置input的multiple属性.

可以使用accept属性规定文件上传的MIME类型 例如’image/jpeg’

var btn = document.querySelector(‘#btn_1’);
var input = document.querySelector(‘#input_1’);
btn.addEventListener(‘click’, function() {
// 获取文件域中选择的文件
// var file = input.files[0];
var file = input.files.item(0);
if (file) {
result.innerHTML =
‘文件名：’ + file.name + ‘n文件最近修改时间：’ + file.lastModifiedDate+ ‘n文件类型：’ + file.type + ‘n文件大小：’ + file.size + ‘字节’
} else {
result.innerHTML = ‘没有选择任何文件’;
}
});