URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 docume
URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。
URL.createObjectURL(blob)和FileReader.readAsDataURL(file)很相似,下面是个人的一些理解,如有不正确的地方,欢迎指出:
主要区别
执行时机:
内存使用:
兼容性方面两个属性都兼容ie10以上的浏览器。
优劣对比:
使用方式:
objectURL = URL.createObjectURL(blob);
示例
html 文件
<input type="file" id="btn" accept="image/*" value="点击上传" />
<img id="img"/>
js 文件
btn.addEventListener('change',function(){
let file = this.files[0];
// 进一步防止文件类型错误
if(!/image\/\w+/.test(file.type)){
alert("看清楚,这个需要图片!");
return false;
}
img.src = URL.createObjectURL(file)
})
到此这篇关于关于URL.createObjectURL()的使用方法的文章就介绍到这了,更多相关URL.createObjectURL()用法内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!
--结束END--
本文标题: 关于JavaScript的URL.createObjectURL()的使用方法
本文链接: https://www.lsjlt.com/news/211217.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0