客户端项目中前端使用img标签怎样显示本地磁盘图片

在客户端项目中，前端展示用户输入的本地图片绝对路径，使用img标签怎样显示本地磁盘图片

可以参考一下上传文件的操作。选择图片后临时生成一个图片地址然后显示。
比如这样：

<!DOCTYPE html>
<html>
<head>
  <title>上传图片并预览</title>
  <style>
    #preview {
      max-width: 300px;
      max-height: 300px;
    }
  </style>
</head>
<body>
  <input type="file" id="upload" accept="image/*">
  <div id="preview"></div>
  <script>
    // 获取上传文件的input元素和预览图片的容器
    var uploadInput = document.getElementById('upload');
    var previewContainer = document.getElementById('preview');
    // 监听文件选择事件
    uploadInput.addEventListener('change', function() {
      // 获取选中的文件
      var file = this.files[0];
      // 创建文件读取器
      var reader = new FileReader();
      // 读取文件完成时触发的事件
      reader.onload = function(e) {
        // 创建一个新的图片元素
        var img = document.createElement('img');
        img.src = e.target.result;
        img.style.maxWidth = '100%';
        img.style.maxHeight = '100%';
        // 清空预览容器并添加新的图片元素
        previewContainer.innerHTML = '';
        previewContainer.appendChild(img);
      }
      // 读取文件为Data URL
      reader.readAsDataURL(file);
    });
  </script>
</body>
</html>