原生JS寫Ajax的請求函式

已上傳至github

ajax：一種請求資料的方式，不需要重新整理整個頁面；

ajax的技術核心是 xmlhttprequest 物件；

ajax 請求過程：建立 xmlhttprequest 物件、連線伺服器、傳送請求、接收響應資料；

除錯過程中需要搭建apache服務

html檔案如下：（有詳細的注釋）

1

doctype html
>
2<
html
>
3<
head 
lang
="en"
>
4<
meta 
charset
="utf-8"
>
5<
title
>原生js的ajax
title
>
6head
>
7<
body
>812
13<
script
>
14//
1.處理get請求
15function
ajax(option)
3031
//5.將處理好的資料字串替換原有的資料
32option.data 
=data;
3334
//判斷是否是get方法，如果是檢查url中有沒有？然後再把data資料加到？後
35if
(isget)
39option.url
+=+"&"
+option.data;40}
4142
//6 判斷是否啟用快取，如果不啟用快取 新增時間
43if(!
option.cache)
47//
開啟連線
48xhr.open(option.method,option.url,option.async);
49//
7.如果是post請求則設定請求頭
50if(!
isget)
5354
//8.傳送請求
55xhr.send(option.data);
56//
9.ajax狀態改變時觸發函式
57xhr.onreadystatechange 
=function
()else66}
6768}69
70}7172
ajax(,
77cache:
true,78
sendbefore:
function
(xhr),
81sendcomplete:
function
(xhr),
84success:
function
(txt),
87error:
function
(status)
90});
9192
script
>
93body
>
94html
>

<?php 

echo 'get';
print_r($_get
); 
echo 'post';
print_r($_post
); 

注意：如果不是在apache伺服器下，會顯示以下資訊

原生JS寫Ajax的請求函式

ajax 一種請求資料的方式，不需要重新整理整個頁面 ajax的技術核心是 xmlhttprequest 物件 ajax 請求過程 建立 xmlhttprequest 物件 連線伺服器 傳送請求 接收響應資料 下面簡單封裝乙個函式，之後稍作解釋 ajax 請求引數 datatype json suc...

js原生ajax請求

建立向後台伺服器的乙個請求 確定傳送的方式方法 傳送請求 確定後台載入完畢 獲取到請求返回的資料 ajax 能夠處理那些型別檔案 文型別檔案 如 html txt js css json xml ajax,需要配合js 的基本事件以及dom操作共同使用。ajax負責的是獲取資料，但是將獲取到的資料放...

原生js的ajax請求

針對get方法 針對post方法 注意 1.setrequestheader 把指定首部設定為所提供的值。在設定任何首部之前必須先呼叫open 設定header並和請求一起傳送 post 方法一定要 2.post請求一定要新增請求頭才行不然會報錯 3.open method url asyncfla...