OVtNfP.jpg

简介

通过前端向服务器发送http请求
AJAX 全称为 Asynchronous JavaScript And XML,就是异步的 JS 和 XML
无刷新获取数据
AJAX的优点
1) 可以无需刷新页面而与服务器端进行通信。 2) 允许你根据用户事件来更新部分页面内容。
AJAX的缺点
1) 没有浏览历史,不能回退 2) 存在跨域问题(同源) 3) SEO 不友好

当我们发现网页存在"hello world",查看源代码却未发现该字符串,说明该字符串是通过ajax请求拿到的

使用

核心对象:XMLHttpRequest,AJAX 的所有操作都是通过该对象进行的
使用步骤
    创建 XMLHttpRequest 对象
    var xhr = new XMLHttpRequest();
    设置请求信息
    xhr.open(method, url); //可以设置请求头,一般不设置

OVamYn.png

这里创建一个xhr的ajax对象之后,用get方式去访问url,send发送请求,通过判断服务器返回的状态值来呈现不同的状态
console.log(xhr.status);//状态码
console.log(xhr.statusText);//状态字符串
console.log(xhr.getAllResponseHeaders());//所有响应头
console.log(xhr.response);//响应体

xhr.setRequestHeader('name','atguigu');
xhr.send('a=100&b=200&c=300');
//这里设置请求头,设置post参数

OVd0Cn.png

jQuery 中的 AJAX 使用

get 请求

$.get(url, [data], [callback], [type])
    url:请求的 URL 地址
    data:请求携带的参数
    callback:载入成功时回调函数
    type:设置返回内容格式,xml, html, script, json, text, _default

post 请求

和上面一样

OVwex0.png

results matching ""

    No results matching ""