js blob对象,Blob对象

  js blob对象,Blob对象

  HTML5中的BLOB对象和MYSQL中的Blob类型有概念上的区别。MYSQL中的BLOB类型只是一个二进制数据容器。HTML5中的Blob对象除了存储二进制数据,还可以设置这些数据的矿类型,相当于存储文件。许多其他二进制对象也是从这个对象继承的。

  在现代浏览器的早期版本中,这个Blob对象还没有被标准化,所以需要通过BlobBuilder的方式来创建。但是现在Blob已经足够标准化,可以通过直接更新其构造函数Blob来创建,而且几乎所有的浏览器都已经支持这种方法,所以没有必要与旧标准纠缠不清。

  代码将内容复制到剪贴板vardata= b style= font-size:32px;颜色:红色;次氯酸盐钴/b ;varblob=newBlob([data],{ type : text/html });console . log(blob);

  这样,我们就创建了一个Blob对象。注意,构造函数Blob的参数很奇怪。第一个参数是一组数据,所以它必须是一个数组。即使像上面的例子只有一个字符串,也必须用数字组装。第二个参数是这个Blob对象的配置属性。目前只有一种类型,就是相关的MIME,需要设置。使用key-value的方式可能是为了将来的扩展。

  那么,把数据做成Blob有什么用呢?对于Blob对象,我们可以创建一个URL来访问它。使用URL对象的createObjectURL方法。

  代码将内容复制到剪贴板vardata= b style= font-size:32px;颜色:红色;次氯酸盐钴/b ;varblob=newBlob([data],{ type : text/html });onload=function(){ vari frame=document . createelement( iframe );iframe . src=URL . createobjecturl(blob);document . body . appendchild(iframe);};

  不仅是上面例子中的text/html,浏览器支持的任何类型都可以这样使用。而且这个Blob-URL的生命周期是从创建到文档发布,不会造成资源浪费。

  Blob是HTML5中非常基础的二进制数据对象,很多方法的操作参数都支持使用Blob,我不能一下子列出来。简而言之,几乎所有参数类型为二进制数据的方法都支持使用Blob作为参数。所以把数据做成Blob可以让后续的一些列操作更加方便。

  方法

  切片()

  返回一个新的Blob对象,该对象包含源Blob对象中指定范围内的数据。

  代码将内容复制到剪贴板blobslice(可选longlongstart,可选longend,可选domstringcontypes);参数启动可选

  开始索引,可以是负数,语法类似于数组的切片方法。默认值为0。

  结束可选

  结束索引可以是负数,其语法类似于数组的slice方法。默认值是最后一个索引。

  类型contentType可选

  新Blob对象的MIME类型,它将成为新Blob对象的type属性的值,默认值为空字符串。

  返回值

  一个新的Blob对象,包含源Blob对象中指定范围内的数据。

  注意

  如果start参数的值大于源Blob对象的size属性值,则返回的Blob对象的size值为0,即它不包含任何数据。

  BlobPropertyBag

  包含类型和结尾两个属性的对象。

  类型

  设置Blob对象的type属性。

  结尾(过时)

  对应BlobBuilder.append()方法的endings参数。此参数的值可以是“透明”或“本机”。

  Blob构造函数用法示例

  以下代码:

  代码将内容复制到剪贴板varafileparts=[ aid=\ a \ bid=\ b \ 嘿!\/b \/a ];varomylob=new blob(afile parts,{ type : text \/XML });//theblob

  相当于:

  代码将内容复制到剪贴板varoBuilder=new blob builder();varaFileParts=[ aid=\ a \ bid=\ b \ 嘿!\/b \/a ];obuilder . append(afile parts[0]);varomy blob=obuilder . get blob( text \/XML );//theblob

  BlobBuilder接口提供了另一种创建Blob对象的方法,但是这种方法现在已经过时了,所以不应该再使用了。

  示例:使用类型数组和Blob对象创建对象URL

  半铸钢钢性铸铁(Cast Semi-Steel)代码复制内容到剪贴板vartypedarray=getthettypedarray好歹();varblob=newBlob([typedArray],{ type: application/oct-binary });//传入一个合适的哑剧型态类型varurl=URL。createobjecturl(blob)://会产生一个类似blob:d 3958 F5 c-0777-0845-9 DCF-2c 28783 acaf这样的网址(URL)字符串//你可以像使用一个普通网址(URL)那样使用它,比如用在img.src档案上。

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

留言与评论(共有 条评论)
   
验证码: