資訊專欄INFORMATION COLUMN
摘要：你知道在瀏覽器環(huán)境下能夠利用到的提交請求數(shù)據(jù)的方式有哪些嗎這些方式各自有什么特點呢在什么情況下使用呢讓我們一起來整理一下。其實這也是能夠利用到的提交請求數(shù)據(jù)的方式之一。
你知道在瀏覽器環(huán)境下JavaScript能夠利用到的提交/請求數(shù)據(jù)的方式有哪些嗎？這些方式各自有什么特點呢？在什么情況下使用呢？讓我們一起來整理一下。
基礎(chǔ)知識建議大家先看完這幾篇文章，了解一下基礎(chǔ)知識
HTTP訪問控制(CORS)
瀏覽器和服務(wù)器實現(xiàn)跨域（CORS）判定的原理
JavaScript 的同源策略
淺談瀏覽器端JavaScript跨域解決方法
XMLHTTPRequestXMLHTTPRequest是最常見的，也是很多框架封裝的數(shù)據(jù)請求方法的底層實現(xiàn)，如我們最熟悉的各類框架的Ajax方法。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
可以利用Form(表單)來提交/請求，這太常用，于是我們習(xí)以為常了。其實這也是JavaScript能夠利用到的提交/請求數(shù)據(jù)的方式之一。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form
文檔有意思的，常被新手忽略的的target屬性，可配合iframe實現(xiàn)無刷新地與服務(wù)器交互（跨域）
既然Form Action也算，那a標(biāo)簽的href也算吧，233
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
沒錯，這個也算。JSONP就是利用script標(biāo)簽的src來請求數(shù)據(jù)，然后等待數(shù)據(jù)請求完畢后從script標(biāo)簽中讀取數(shù)據(jù)，巧妙地解決了跨越的問題。一些AMD JavaScript框架也用script標(biāo)簽來異步加載模塊，如requirejs。一些JavaScript模版也會用script標(biāo)簽來加載模版，如artTemplate。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
沒錯我說的就是這些。腦洞開起來，一起整理出來。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
Img Src這個也可以用來數(shù)據(jù)，一般是圖像數(shù)據(jù)。JavaScript可以監(jiān)聽圖像加載后的響應(yīng)。可以拿到圖像像素數(shù)據(jù)，可以配合Canvas做復(fù)雜圖像處理，不過有跨域限制。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img
Audio Src和上面的差不多。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio
對于audio底層處理有興趣的可以參考這篇
努力翻譯一篇中文最友好的，Web Audio API的使用相關(guān)的文章
Video Src和上面的差不多。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video
差點忘了這兩個兄弟，雖然哥哥frame已經(jīng)基本沒人用了。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
這個新出的玩意兒，只有少數(shù)高版本瀏覽器支持。本質(zhì)與XMLHTTPRequest不同。但有的框架為了支持更多平臺，統(tǒng)一API，對不支持Fetch的瀏覽器提供底層XMLHTTPRequest實現(xiàn)的支持。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
PS: 以上大多數(shù)情況下都是用到基于HTTP協(xié)議的功能，少數(shù)有用到file協(xié)議和ftp協(xié)議的。
WebSocketWebSocket則提供給我們機會讓我們利用TCP協(xié)議與服務(wù)端建立長鏈接，持續(xù)通信。
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/API/WebSocket
越來越厲害了，233
詳細文檔：https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API
補充一點，注意區(qū)分get跨域和post跨域
待更新fetch的源碼，原理相關(guān)
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/79974.html
摘要：前端面試題及答案總結(jié)掘金技術(shù)征文金三銀四，金九銀十，用來形容求職最好的幾個月。因為的存在，至少在被標(biāo)準(zhǔn)化的那一刻起，就支持異步編程了。然而異步編程真正發(fā)展壯大，的流行功不可沒。 showImg(https://segmentfault.com/img/bVVQOH?w=640&h=319); 1、2017前端面試題及答案總結(jié) |掘金技術(shù)征文 金三銀四，金九銀十，用來形容求職最好的幾個月...
摘要：忍者級別的函數(shù)操作對于什么是匿名函數(shù)，這里就不做過多介紹了。我們需要知道的是，對于而言，匿名函數(shù)是一個很重要且具有邏輯性的特性。通常，匿名函數(shù)的使用情況是創(chuàng)建一個供以后使用的函數(shù)。 JS 中的遞歸 遞歸, 遞歸基礎(chǔ), 斐波那契數(shù)列, 使用遞歸方式深拷貝, 自定義事件添加 這一次，徹底弄懂 JavaScript 執(zhí)行機制 本文的目的就是要保證你徹底弄懂javascript的執(zhí)行機制，如果...
摘要：瀏覽器對象可以獲取瀏覽器提供的很多對象，并進行操作。對象不但充當(dāng)全局作用域，而且表示瀏覽器窗口。對象表示當(dāng)前頁面的信息。由于在瀏覽器中以形式表示為樹形結(jié)構(gòu)，對象就是整個樹的根節(jié)點。這個行為由瀏覽器實現(xiàn)，主流瀏覽器均支持選項，從開始支持。 由于JavaScript的出現(xiàn)就是為了能在瀏覽器中運行，所以，瀏覽器自然是JavaScript開發(fā)者必須要關(guān)注的。【寫的比較多，難免有疏漏的地方，希望...
摘要：后端好書閱讀與推薦系列文章后端好書閱讀與推薦后端好書閱讀與推薦續(xù)后端好書閱讀與推薦續(xù)二幾個月又過去了，又讀了幾本書，同時為了深切體會到某些書里面的要點還專門做了一個小項目，這里就把讀書與小項目過程中的一些心得體會記錄一下。 后端好書閱讀與推薦系列文章：后端好書閱讀與推薦后端好書閱讀與推薦（續(xù)）后端好書閱讀與推薦（續(xù)二） 幾個月又過去了，又讀了幾本書，同時為了深切體會到某些書里面的要點還...
閱讀 2885·2021-10-26 09:49
閱讀 3221·2021-10-14 09:42
閱讀 2042·2021-09-13 10:31
閱讀 2580·2019-08-30 11:13
閱讀 2962·2019-08-29 16:31
閱讀 1068·2019-08-29 13:58
閱讀 1859·2019-08-29 12:12
閱讀 3554·2019-08-26 13:48
