JavaScript Blob对象

最新推荐文章于 2024-08-14 20:34:44 发布

sayyy

最新推荐文章于 2024-08-14 20:34:44 发布

阅读量484

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/sayyy/article/details/117377340

版权

Blob对象 URL.createObjectURL 图片预览 Web开发 JavaScript

关键词由CSDN通过智能技术生成

JavaScript 专栏收录该内容

88 篇文章 2 订阅

订阅专栏

前言

略

创建 Blob对象

var blob = new Blob(["Hello World!"],{type:"text/plain"});
console.log(blob); /* Blob {size: 12, type: "text/plain"} */

预览图片

拿到了一个Blob对象，该对象对应一个图片，可以使用下面的方式预览：

cropper.getCroppedCanvas().toBlob(function(img) {
	var image2 = document.getElementById('avatar2');
	image2.src=URL.createObjectURL(img);
});

img 是个图片Blob对象
avatar2 是个 html img 元素

示例

<!DOCTYPE html>
<html lang="zh" >
<head>
	<meta charset="utf-8">
</head>
<body class="white-bg">
	<a id="id1" href="#">blob</a>

<script type="text/javascript">
	var blob = new Blob(["Hello World!"],{type:"text/plain"});
	var id1Element = document.getElementById("id1");
	id1Element.href = URL.createObjectURL(blob);
</script>
</body>
</html>