<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="utf-8">
<title>XMLHTTPRequest</title>
</head>
<body>
<h1>XMLHTTPRequest</h1>
<script>
// 1. 建立 XMLHttpRequest 物件
let xhr = new XMLHttpRequest();
// 2. 設定要向哪個網址取得資料,HTTP verb 為 GET,最後一個參數決定是否以非同步方式來執行
xhr.open("GET", "https://notes.webmix.cc/ajax/teach/simple_ajax.php", true);
//xhr.open("GET", "https://notes.webmix.cc/ajax/teach/simple_500.php", true);
// 3. 如果伺服器有回應的話,就會執行此函式
xhr.addEventListener("load", function(){
console.log("執行到 load 程式");
console.log(xhr);
});
// 4. 如果產生錯誤,有可能執行這裡的程式
xhr.addEventListener("error", function(){
console.log("執行到 error 程式");
console.log(xhr);
});
// 5. 無論是 load 或 error 觸發,最後 loadend 都會觸發
xhr.addEventListener("loadend", function(){
console.log("執行到 loadend 程式");
});
// 6. 發送請求
xhr.send();
//console.log("ajax 發送之後的程式");
</script>
</body>
</html>