博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
window.URL对象的使用方式
阅读量:5992 次
发布时间:2019-06-20

本文共 2097 字,大约阅读时间需要 6 分钟。

1 window.URL是干嘛的?

window对象的URL对象是专门用来将blob或者file读取成一个url的。

window.URL.createObjectURL(file / blob)

这个url可以用在html的任何可以使用url的地方,比如img的src ; audio/video的src和source标签等。

所有能在浏览器中显示的图片、音频、视频等都是可以用url转换成一个url对象的,这个对象一旦被src引用,就会显示出来。

那么这些file或者blob来自于哪里呢?可以是在本地硬盘中通过<input type='file'>选择的文件,也可以是通过ajax请求后某个不知名的服务器请求到内存的。

问题: 如果一个img标签的src属性是一个excel文件转换成的url对象,那会发生什么?

我想img肯定将它读不出来,因为会img标签会检测文件类型。

2.URL构造函数将普通url转换成URL对象

除了可以将一个文件或者blob转化成一个Url对象,还可以将一个url字符串转换成一个URL对象

// https://cn.bing.com?id=123var parsedUrl = new URL('https://cn.bing.com?id=123v');console.log('parsedUrl' , parsedUrl, parsedUrl.searchParams.get("id")); // 123console.log('parsedUrl' , parsedUrl.toString(), parsedUrl.searchParams.set("name" , 'alexandra')); // https://cn.bing.com/?id=123v&name=alexandra

searchParams属性返回一个URLSearchParams对象,这样就可以对url对象中的参数进行遍历或者其他操作

var urlSearchParams = URL.searchParams;

3.URL实例对象的toString()方法

URL的toString()方法可以将URL转换成url字符串,且:

URL.toString() === URL.href
// http://www.example.com/démonstration.htmllet url = new URL('http://www.example.com/démonstration.html')let test = url.toString() === url.href;console.log('url.href', url.href, 'url.toString()' , url.toString() , 'test' , test);// url.href http://www.example.com/d%C3%A9monstration.html url.toString() http://www.example.com/d%C3%A9monstration.html test true

4.URL对象静态方法createObjectURL(object)

URL.createObjectURL(object)是URL 对象的静态方法,用于创建一个DOMString(is a UTF-16 string),其实就是返回了一个在内存中指向传入参数object的引用路径url字符串。

生成的这个url字符串会在当前页面的document被销毁的时候失效。

objectURL = URL.createObjectURL(object);objectA File, Blob or MediaSource object to create an object URL for.returnA DOMString containing an object URL that can be used to reference the contents of the specified source object.

5.URL对象静态方法revokeObjectURL(objectURL)

URL对象的静态方法revokeObjectURL()用于销毁之前通过URL.createObjectURL(object)方法创建的url。

一旦调用这个方法就表示告诉浏览器不再保存之前被创建的那个url了。 在revokeObjectURL(objectURL)之后,再次使用该url,会报错,因为该url已经被销毁,无法使用了。

window.URL.revokeObjectURL(objectURL);objectURLA DOMString representing a object URL that was previously created by calling createObjectURL().return ubdefined

转载地址:http://vyxlx.baihongyu.com/

你可能感兴趣的文章
项目启动时注意事项
查看>>
排查 “Detected Tx Unit Hang”问题
查看>>
c++ 如何定义未知元素个数的数组?【转】
查看>>
angularjs $routeProvider template 函数及参数解惑
查看>>
Oracle 11g R2 常见问题处理
查看>>
aliyun_api_cmd.py——在命令行调用阿里云API
查看>>
Centos下***(pptpd)的部署
查看>>
操作无法完成。键入的打印机名不正确,或者指定的打印机没有连接到服务器上的解决办法!...
查看>>
struts2的restful
查看>>
Java基础加强-代理
查看>>
linux系统中实现多网卡的绑定
查看>>
6.Java集合-LinkedList实现原理及源码分析
查看>>
SP2与R2的区别之处
查看>>
Notifyall学习笔记
查看>>
The Journey Of Success
查看>>
java调用cmd命令
查看>>
POJ-2159(Water)
查看>>
python学习之-影像和集合类型
查看>>
mongodb的安装/配置(文件)/启动 问题
查看>>
图像处理之应用卷积一实现噪声消去
查看>>