FileReader：读取图片文件并显示

最新推荐文章于 2021-02-16 17:53:39 发布

X_X_OO

最新推荐文章于 2021-02-16 17:53:39 发布

阅读量2.7k

点赞数

本文链接：https://blog.csdn.net/X_X_OO/article/details/52529591

版权

这篇博客介绍了如何利用JavaScript的FileReader API读取图片文件，并在网页中显示。通过创建HTML元素，获取文件输入节点，判断浏览器兼容性，监听change事件，读取文件数据并转换为dataURL，最后在onload事件中插入img标签展示图片。

摘要由CSDN通过智能技术生成

第一步创建html

<p> 
   <label>请选择一个图像文件：</label> 
   <input type="file" id="file_input" /> 
</p>  
<div id="result"></div>

通过getElementById获取节点，判断浏览器的兼容性.

关注