任务1：jQuery操作Ajax
任务要求：
掌握jQuery操作Ajax的方法。
任务实现：
先搭建一个Web服务器，创建app.js文件：
// 引入express模块
var express = require('express');
// 创建Web服务器对象
var app = express();
// 设置允许跨域
app.all('*', (req, res, next) => {
res.setHeader('Access-Control-Allow-Origin', '*');
next();
});
// GET请求
app.get('/get', (req, res) => {
// 对客户端做出响应
res.send('Hello, GET');
});
// POST请求
app.post('/post', (req, res) => {
// 对客户端做出响应
var data = {
user: 'zhangsan',
pass: '123456'
};
res.send(data);
});
// 监听3000端口
app.listen(3000, () => {
console.log('服务器启动成功...');
});
使用$.get()、$.post()和$.ajax()向服务器发送请求：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery-3.6.0.min.js"></script>
</head>
<body>
<script>
$.get('http://localhost:3000/get', function (msg) { //使用$.get()向服务器发送请求
console.log(msg);
});
$.post('http://localhost:3000/post', function (msg) { //使用$.post()向服务器发送请求
console.log(msg);
}, 'json');
$.ajax({
type: 'GET',
url: 'http://localhost:3000/get', //使用$.ajax()向服务器发送请求
success: function (msg) {
console.log(msg);
}
});
</script>
</body>
</html>
