抱歉,您的浏览器无法访问本站

本页面需要浏览器支持(启用)JavaScript


了解详情 >

会飞的鱼

飞鱼儿的宁静小鱼塘~

Ajax

AJAX简介

AJAX 全称为 Asynchronous JavaScript And XML,就是异步的 JS 和 XML。

通过 AJAX 可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。

AJAX 不是新的编程语言,而是一种将现有的标准组合在一起使用的新方式

AJAX优缺点

AJAX的优点

    1. 可以无需刷新页面而与服务器端进行通信
    1. 允许根据用户事件来更新部分页面内容

AJAX的缺点

    1. 没有浏览历史,不能回退
    1. 存在跨域问题
    1. SEO不友好

express框架基本使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
//1. 引入express
const express = require('express');

//2. 创建应用对象
const app = express();

//3. 创建路由规则
// request 是对请求报文的封装
// response 是对响应报文的封装
app.get('/', (request, response)=>{
//设置响应
response.send('HELLO EXPRESS');
});

//4. 监听端口启动服务
app.listen(8000, ()=>{
console.log("服务已经启动, 8000 端口监听中....");
});

AJAX基本使用

核心对象

XMLHttpRequest,AJAX 的所有操作都是通过该对象进行的。

使用步骤

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
1) 创建 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
2) 设置请求信息
xhr.open(method, url);
//可以设置请求头,一般不设置
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
3) 发送请求
xhr.send(body) //get 请求不传 body 参数,只有 post 请求使用
4) 接收响应
//xhr.responseXML 接收 xml 格式的响应数据
//xhr.responseText 接收文本格式的响应数据
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var text = xhr.responseText;
console.log(text);
}
}

评论