分为HTML和JS两部分(参考尚硅谷教程):
环境要求:安装有Node.js环境和express
(一)HTML部分:
获取元素对象 ,比如用元素id获取:
const a = document.getElementById(“...”);
绑定事件
a.addEventListener("",function(){
// 四步走:
// 1.创建对象
const xhr = new XMLHttpRequest( );
// 2.初始化 设置请求的类型和URL
xhr.open(‘GRT’,’http://...’);
// 3.发送
xhr.send( );
// 4.事件绑定
xhr.onreadystatechange = function(){
/*判断(readystate 是xhr 对象中是属性,表示状态0 1 2 3 4;4表示服务端返回了所有的结果,[200,300)表示成功)*/
if(xhr.readyState == 4){
if(xhr.status >=200 &&xhr.status <300){
//处理服务端返回的结果
}
}
}
}
(二)JS 部分server.js:
//1.引入express
const express = require('express');
//2.创建应用对象
const app = express();
//3.创建路由规则
//request 是对请求报文的封装
//response 是对响应报文的封装
app.get('/',(request,response)=>{
//设置响应头 设置允许跨域
response.setHeader('Access-Control-Allow-Origin','*');
//设置响应
response.send('HELLO AJAX');
});
//4.监听端口启动服务
app.listen(8000, ()=>{
console.log("服务已启动,8000 端口监听中.....");
})
(三)在终端集成环境中输入node server.js
(四)完成了哦,可以在游览器中查看