AJAX GET的请求
生活随笔
收集整理的這篇文章主要介紹了
AJAX GET的请求
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>AJAX GET 請(qǐng)求</title><style>#result{width:200px;height:100px;border:solid 1px #90b;}</style>
</head>
<body><button>點(diǎn)擊發(fā)送請(qǐng)求</button><div id="result"></div><script>//獲取button元素const btn = document.getElementsByTagName('button')[0];const result = document.getElementById("result");//綁定事件btn.onclick = function(){//1. 創(chuàng)建對(duì)象const xhr = new XMLHttpRequest();//2. 初始化 設(shè)置請(qǐng)求方法和 urlxhr.open('GET', 'http://127.0.0.1:8000/server?a=100&b=200&c=300');//3. 發(fā)送xhr.send();//4. 事件綁定 處理服務(wù)端返回的結(jié)果// on when 當(dāng)....時(shí)候// readystate 是 xhr 對(duì)象中的屬性, 表示狀態(tài) 0 1 2 3 4// change 改變xhr.onreadystatechange = function(){//判斷 (服務(wù)端返回了所有的結(jié)果)if(xhr.readyState === 4){//判斷響應(yīng)狀態(tài)碼 200 404 403 401 500// 2xx 成功if(xhr.status >= 200 && xhr.status < 300){//處理結(jié)果 行 頭 空行 體//響應(yīng) // console.log(xhr.status);//狀態(tài)碼// console.log(xhr.statusText);//狀態(tài)字符串// console.log(xhr.getAllResponseHeaders());//所有響應(yīng)頭// console.log(xhr.response);//響應(yīng)體//設(shè)置 result 的文本result.innerHTML = xhr.response;}else{}}} }</script>
</body>
</html>
總結(jié)
以上是生活随笔為你收集整理的AJAX GET的请求的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Express 的简单使用
- 下一篇： AJAX POST 请求