Ajax知識筆記——入門,同步和異步,XHR

Ajax全稱:Asynchronous Javascript and XML ,異步的javascript和XML。

Ajax不是一種語言,是一種無需重新加載整個網頁的情況下,能更新部分網頁的技術。

(與后臺交互,實現局部更新,異步更新)

同步和異步

同步(Ajax出現之前):客戶端發起請求,服務端對請求進行處理和響應,這期間客戶端一直在等待服務器端的響應,得到服務器端的響應之后客戶端重新載入頁面,這時候如果你有錯誤,只能再次發起請求,再次等待……


異步(Ajax出現之后)XMLHttpRequest的出現,使得 后臺 與 服務器 在不重新加載頁面的情況下進行數據的交換(并對網頁進行部分的更新)。


XMLHttpRequest

實例化XHR對象:

<span style="font-family:SimSun;font-size:12px;">var request </span><span style="font-family:Microsoft Yahei, Hiragino Sans GB, Helvetica, Helvetica Neue, 微軟雅黑, Tahoma, Arial, sans-serif;font-size: 14px;">= </span><span style="font-family:SimSun;font-size:12px;">new XMLHttpRequest();</span>

考慮瀏覽器兼容性:

var request;
if(window.XMLHttpRequest){
request = new XMLHttpRequest();//IE7+,Firefox,Chrome,Opera,Safari…
}else{
request = new ActiveXObject("Microsoft.XMLHTTP");//IE6,IE5
}
XMLHttpRequest 兩個重要方法
open(method,url,async)——參數:請求方式、請求地址、請求同步/異步;
send(string)——參數:使用POST方式時,填寫此參數。

用法實例:
request.open("POST","create.php",true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //要寫在open和send之間

request.send("name=張三&sex=男");


readyState屬性:
0 :請求未初始化,open還沒有調用
1 :服務器連接已建立,open已經調用了
2 :請求已接收,也就是接收到頭信息了
3 :請求處理中,也就是接收到響應主體了。
4 ?: 請求已完成,且響應已就緒,也就是響應完成了

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/386105.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/386105.shtml
英文地址,請注明出處:http://en.pswp.cn/news/386105.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

保駕護航金三銀四,含BATJM大廠

前言 跳槽&#xff0c;這在 IT 互聯網圈是非常普遍的&#xff0c;也是讓自己升職加薪&#xff0c;走上人生巔峰的重要方式。那么作為一個普通的Android程序猿&#xff0c;我們如何才能斬獲大廠offer 呢&#xff1f; 疫情向好、面試在即&#xff0c;還在迷茫躊躇中的后浪們&…

保駕護航金三銀四,媽媽再也不用擔心我找工作了!

01 前言 2021是不平凡的一年&#xff0c;這一年里發生許多事情&#xff0c;大家也都知道。對于互聯網行業來說也是一次重大的打擊&#xff0c;也有一些企業在這次疫情中倒閉了&#xff0c;所以可能對于今年2021年畢業的同學來說是一次很大的考驗&#xff0c;也關乎我們的前途。…

web開發者工具,118頁Vue面試題總結,漲姿勢!

邏輯運算符 JavaScript中有三個邏輯運算符&#xff0c;&&與、||或、!非。 JavaScript 中的邏輯運算符可用來確定變量或者是值之間的邏輯關系。通常用于布爾型值&#xff0c;會返回一個布爾值true 或 false。而 &&、|| 運算符能夠使用非布爾值的操作數&#x…

2G、3G 和 4G

2G、3G 和 4G 區別形象比喻 版本1&#xff1a; 2G 看小說&#xff1b; 3G 看app、微博、新聞……&#xff1b; 4G 看蒼井空、松島楓…… 版本2&#xff1a; 2G 看「女教師.txt」 3G 看「女教師.jpg」 4G 看「女教師.avi」 版本3&#xff1a; 選自&#xff1a;365知識網 2G:打個…

web開發者工具,261頁前端面試題寶典,通用流行框架大全

開頭 Web前端開發基礎知識學習路線分享&#xff0c;前端開發入門學習三大基礎&#xff1a;HTML、CSS、JavaScript。除此之外還要學習數據可視化、Vue、React、Angular相關框架&#xff0c;熟練運用框架提升開發效率&#xff0c;提升穩定性。 [外鏈圖片轉存失敗,源站可能有防盜…

jsp+js實現二級級聯

本文實現學院-專業二級級聯&#xff0c;同理可用到省份-城市&#xff0c;洲-國家等級聯&#xff0c;即通過不同的首選擇&#xff0c;自動找到屬于第一選擇的二次可選項。 test.jsp <% page language"java" contentType"text/html; charsetgb2312" impor…

web開發者工具,你必須知道的CSS盒模型,架構師必備!

前言 不要為了面試而去背題&#xff0c;匆匆忙忙的&#xff0c;不僅學不進去&#xff0c;背完了幾天后馬上會忘記。 你可能會說&#xff0c;“沒辦法&#xff0c;這不是為了能找份工作嘛&#xff01;”。我想說的是&#xff0c;“那你沒開始找工作的時候&#xff0c;咋不好好…

web開發要學多久,HTML表格標簽,薪資翻倍

前言 作為一個程序員&#xff0c;當然總是期望自己的代碼能「一次編寫&#xff0c;四處運行」&#xff0c;但真實經驗往往是「一處修改&#xff0c;百處填坑」&#xff0c;依賴落后了好幾個版本了想要升級、老代碼已經看著很不爽了打算重構&#xff0c;都需要下堅決的決心&…

js含有特定文字不能跳轉

<html> <head> <script type"text/javascript"> function checkUpload() { for(var i0;i<document.files.filename.length;i){ if(document.files.filename[i].value"未選擇文件"){alert("請檢查要上傳的文件是否全部添加!"…

web開發課程培訓,10大前端常用算法,學習路線+知識點梳理

標簽語義化&#xff1a; 語義和默認樣式的區別&#xff1a; 默認樣式是瀏覽器設定的一些常用tag的表現形式&#xff1b;語義化的主要目的就是讓大家直觀的認識標簽和屬性的用途和作用&#xff1b; 標簽語義化作用&#xff1a; 當只有HTML頁面時&#xff0c;沒有CSS&#xf…

web開發課程,CSS標準文檔流與脫離文檔流,已整理成文檔

前言 年前準備換工作&#xff0c;總結了一波面試最頻繁的面試問題跟大家交流。此文章是關于瀏覽器的常見問題&#xff0c;大概面試10家遇到6家提問類似問題&#xff08;主要是大廠和中廠&#xff09;。目前入職滴滴出行成都團隊。 前端核心 1.JSONP的缺點 2.跨域&#xff08…

jQuery學習筆記(一)——基礎選擇器、過濾選擇器、表單選擇器

$()就是jQuery中的函數&#xff0c;它的功能是獲得&#xff08;&#xff09;中指定的標簽元素。如示例中$(“p”)會得到一組P標簽元素,其中“p”表示CSS中的標簽選擇器。$()中的()不一定是指定元素&#xff0c;也可能是函數。 在jQuery中 $()方法等價于jQuery()方法,前者比較常…

web開發課程,HTML常用的五種標簽,附贈課程+題庫

標準文檔流 標準文檔流&#xff0c;指的是元素排版布局過程中&#xff0c;元素會默認自動從左往右&#xff0c;從上往下的流式排列方式。前面內容發生了變化&#xff0c;后面的內容位置也會隨著發生變化。 HTML就是一種標準文檔流文件 HTML中的標準文檔流特點通過兩種方式體現…

jQuery學習筆記(二)—— 操作DOM元素

使用attr()方法控制元素的屬性 attr()方法的作用是設置或者返回元素的屬性&#xff0c;其中attr(屬性名)格式是獲取元素屬性名的值&#xff0c;attr(屬性名&#xff0c;屬性值)格式則是設置元素屬性名的值。 例如&#xff0c;使用attr(屬性名)的格式獲取頁面中<a>元素的“…

web開發軟件,8個優秀的CSS實踐,附面試題

一.為什么要學習前端開發&#xff1f; 你可能是因為興趣&#xff0c;完成一個網站、頁面、功能的成就感。你也可能是因為現在前端崗位火爆&#xff0c;就業率高。不管是因為什么&#xff0c;只要找準了目標&#xff0c;學就是了&#xff01; 突破困境&#xff1a; 1. 提升學…

jQuery 學習筆記(三)——事件與應用

頁面加載時觸發ready()事件 ready()事件類似于onLoad()事件&#xff0c;但前者只要頁面的DOM結構加載后便觸發&#xff0c;而后者必須在頁面全部元素加載成功才觸發&#xff0c;ready()可以寫多個&#xff0c;按順序執行。此外&#xff0c;下列寫法是相等的&#xff1a; $(docu…

web開發軟件,HTML如何添加錨點,成功入職阿里

前言 正式學習前端大概 3 年多了&#xff0c;接觸前端大概 4 年了&#xff0c;很早就想整理這個書單了&#xff0c;因為常常會有朋友問&#xff0c;前端該如何學習&#xff0c;學習前端該看哪些書&#xff0c;我就講講我學習的道路中看的一些書&#xff0c;雖然整理的書不多&a…

cs碩士妹子找工作經歷【阿里人搜等互聯網】

摘自 北郵人論壇 分享他人成功的求職經歷。原文如下&#xff1a; 唉&#xff0c;妹子本來是本著寫面經的態度與大家分享&#xff0c;之自己情況也是想說明一啥都不會的菜鳥在悲催的逆境下也可以憑自身努力找到offer&#xff0c;沒想到被評為作秀。。。妹子能力背景確實和說的…

web開發項目,web前端CSS全局樣式,面試必問

前言 表格是網頁制作中使用最多的工具之一&#xff0c;在制作網頁時&#xff0c;使用表格可以更清晰地排列數據。但是在實際制作過程中&#xff0c;表格更多用在網頁布局的定位上。很多網頁都是以表格布局的。這是因為表格在文本和圖像的位置控制方面都有很強的功能。 字節跳…

Java中key可以重復的Map集合:IdentityHashMap

范例&#xff1a;Map中的key不允許重復&#xff0c;重復就是覆蓋 [java] view plaincopy package org.lxh.demo13.mapdemo; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import java.util.Set; class Person { …