亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專(zhuān)欄INFORMATION COLUMN

window.URL對(duì)象的使用方式

betacat / 2965人閱讀

摘要：是干嘛的對(duì)象的對(duì)象是專(zhuān)門(mén)用來(lái)將或者讀取成一個(gè)的。這個(gè)可以用在的任何可以使用的地方，比如的的和標(biāo)簽等。對(duì)象靜態(tài)方法對(duì)象的靜態(tài)方法用于銷(xiāo)毀之前通過(guò)方法創(chuàng)建的。在之后，再次使用該，會(huì)報(bào)錯(cuò)，因?yàn)樵撘呀?jīng)被銷(xiāo)毀，無(wú)法使用了。

1 window.URL是干嘛的？

window對(duì)象的URL對(duì)象是專(zhuān)門(mén)用來(lái)將blob或者file讀取成一個(gè)url的。

window.URL.createObjectURL(file / blob)

這個(gè)url可以用在html的任何可以使用url的地方，比如img的src ; audio/video的src和source標(biāo)簽等。
所有能在瀏覽器中顯示的圖片、音頻、視頻等都是可以用url轉(zhuǎn)換成一個(gè)url對(duì)象的，這個(gè)對(duì)象一旦被src引用，就會(huì)顯示出來(lái)。

那么這些file或者blob來(lái)自于哪里呢？可以是在本地硬盤(pán)中通過(guò)選擇的文件，也可以是通過(guò)ajax請(qǐng)求后某個(gè)不知名的服務(wù)器請(qǐng)求到內(nèi)存的。

問(wèn)題： 如果一個(gè)img標(biāo)簽的src屬性是一個(gè)excel文件轉(zhuǎn)換成的url對(duì)象，那會(huì)發(fā)生什么？

我想img肯定將它讀不出來(lái)，因?yàn)闀?huì)img標(biāo)簽會(huì)檢測(cè)文件類(lèi)型。

2.URL構(gòu)造函數(shù)將普通url轉(zhuǎn)換成URL對(duì)象

除了可以將一個(gè)文件或者blob轉(zhuǎn)化成一個(gè)Url對(duì)象，還可以將一個(gè)url字符串轉(zhuǎn)換成一個(gè)URL對(duì)象

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

searchParams屬性返回一個(gè)URLSearchParams對(duì)象，這樣就可以對(duì)url對(duì)象中的參數(shù)進(jìn)行遍歷或者其他操作

var urlSearchParams = URL.searchParams;
3.URL實(shí)例對(duì)象的toString()方法

URL的toString()方法可以將URL轉(zhuǎn)換成url字符串，且:

URL.toString() === URL.href
// http://www.example.com/démonstration.html
let 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

https://developer.mozilla.org...

4.URL對(duì)象靜態(tài)方法createObjectURL(object)

URL.createObjectURL(object)是URL 對(duì)象的靜態(tài)方法，用于創(chuàng)建一個(gè)DOMString（is a UTF-16 string），其實(shí)就是返回了一個(gè)在內(nèi)存中指向傳入?yún)?shù)object的引用路徑url字符串。
生成的這個(gè)url字符串會(huì)在當(dāng)前頁(yè)面的document被銷(xiāo)毀的時(shí)候失效。

objectURL = URL.createObjectURL(object);

object
A File, Blob or MediaSource object to create an object URL for.

return
A DOMString containing an object URL that can be used to reference the contents of the specified source object.

https://developer.mozilla.org...

5.URL對(duì)象靜態(tài)方法revokeObjectURL(objectURL)

URL對(duì)象的靜態(tài)方法revokeObjectURL()用于銷(xiāo)毀之前通過(guò)URL.createObjectURL(object)方法創(chuàng)建的url。
一旦調(diào)用這個(gè)方法就表示告訴瀏覽器不再保存之前被創(chuàng)建的那個(gè)url了。 在revokeObjectURL(objectURL)之后，再次使用該url，會(huì)報(bào)錯(cuò)，因?yàn)樵搖rl已經(jīng)被銷(xiāo)毀，無(wú)法使用了。

window.URL.revokeObjectURL(objectURL);

objectURL
A DOMString representing a object URL that was previously created by calling createObjectURL().

return 
ubdefined

https://developer.mozilla.org...

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/101874.html

相關(guān)文章

  • 關(guān)于前端實(shí)現(xiàn)文件下載功能

    摘要：?jiǎn)栴}以上兩種方式，當(dāng)在下載格式，或者視頻文件時(shí)，瀏覽器會(huì)直接播放該文件，而達(dá)不到直接下載的功能，此時(shí)，當(dāng)下載音視頻文件時(shí)無(wú)法使用以上兩種方式。 1、通過(guò)window.open()打開(kāi)新頁(yè)面下載文件 window.open(`url`, _self) 使用場(chǎng)景：下載excel文件，后端提供接口，接口返回的是文件流，可以直接使用window.open()，最簡(jiǎn)單的方式。 優(yōu)點(diǎn)：最簡(jiǎn)潔； 弊...

    Arno 評(píng)論0 收藏0

  • 文件下載那點(diǎn)事

    摘要：不過(guò)這種方式有問(wèn)題，目前查到的大部分過(guò)程都是會(huì)在服務(wù)器新建出一個(gè)文件，等下載完畢在做刪除，還沒(méi)有找到可以跨過(guò)這一步的方式。 showImg(https://segmentfault.com/img/remote/1460000018850368); Content-Disposition / Content-Type Content-Disposition http 頭部的 Conte...

    PascalXie 評(píng)論0 收藏0

  • JS基礎(chǔ)篇--搞清Image加載事件(onload)、加載狀態(tài)(complete)后，實(shí)現(xiàn)圖片的本地

    摘要：與介紹只是對(duì)象的一個(gè)屬性，可以判斷圖片加載完成，不管圖片是不是有緩存而則是這個(gè)對(duì)象的事件回調(diào)，當(dāng)圖片加載完成后執(zhí)行綁定的函數(shù)。第三次點(diǎn)擊，谷歌瀏覽器結(jié)果為瀏覽器結(jié)果為。例打印結(jié)果第一次點(diǎn)擊，谷歌瀏覽器結(jié)果為瀏覽器結(jié)果為空。 onload與complete介紹 complete只是HTMLImageElement對(duì)象的一個(gè)屬性，可以判斷圖片加載完成，不管圖片是不是有緩存；而onload則...

    callmewhy 評(píng)論0 收藏0

  • 如何用 JavaScript 下載文件

    摘要：然而事實(shí)上下載的的確確發(fā)生了，只是要等到下載完文件之后才能構(gòu)建對(duì)象，再轉(zhuǎn)化成文件。權(quán)限校驗(yàn)有些時(shí)候，我們需要對(duì)下載做一些限制，最常見(jiàn)的就是權(quán)限校驗(yàn)了，如檢查該用戶是否有下載的權(quán)限，是否有高速下載的權(quán)限等等。 簡(jiǎn)介 我們知道，下載文件是一個(gè)非常常見(jiàn)的需求，但由于瀏覽器的安全策略的限制，我們通常只能通過(guò)一個(gè)額外的頁(yè)面，訪問(wèn)某個(gè)文件的 url 來(lái)實(shí)現(xiàn)下載功能，但是這種用戶體驗(yàn)非常不好。幸好，...

    Scliang 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<