HTML5 用File对象获取文件信息

对书上案例进行改进和注释。特别注意文件大小单位的转换。下图中前两行是循环中进行的打印，可忽略。


html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>title>
  <script>
    window.onload = function () {
      var oFile = document.getElementById("file");
      oFile.onchange = function(){
        //获取第1个文件
        var file = oFile.files[0];
        //默认单位是B，在此对超过1024B的图片大小进行转换
        var unitArr = ["B", "KB", "MB", "GB", "TB"];
        var size = file.size;
        //转化单位，每循环一次，就上升一个单位
        for (var i = 0; size > 1; i ++) {
          //size.toFixed(2)方法是四舍五入保留2位小数，不会改变size的值
          var fileSizeString = size.toFixed(2) + unitArr[i];
          // console.log(size + " " + fileSizeString);
          size /= 1024;
        }
        //输出结果
        console.log("图片名称为：" + file.name);
        console.log("图片大小为：" + fileSizeString);
        console.log("图片类型为：" + file.type);
        console.log("修改时间为：" + file.lastModifiedDate);
      };
    }
  script>
head>
<body>
  <input id="file" type="file" accept="image/*" />
body>
html>

相关阅读:
性能测试-01-简介
Hive External Table 外部表
原来 GitHub 不仅能学代码，还有这些东西
Redis快速入门
C++深入学习part_2
redis伪集群搭建
IDEA2023.1版本新建Web项目并配置本地Tomcat
【10】Docker私有仓库
【bug日记】spring项目使用配置类和测试类操作数据库
手动实现Transformer

原文地址：https://blog.csdn.net/qq_33514421/article/details/126333684