标签：

1
2
3
4
5
6
7
8
9
10
  $.ajax({
"url":"", //访谒路径
"data":"", // 需要传输的数据
"type":"", // 请求方法
"dataType":"", // 返回值类型
"success":function(obj){}, // 响应告成时的回调函数
"error":function(obj){} // 响应掉败时的回调函数
});
$.get(URL,callback);
$.post(URL,data,callback);
 
用原生JS实现一个接口，能够用Ajax上传文件并显示上传进度，上传完成后接收一个来自处事器的json数据1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
  var xhr = new XMLHttpRequest();
xhr.open('POST', 'url');
// 上传完成后的回调函数
xhr.onreadystatechange = function() {
if (xhr.status === 200) {　　
console.log(xhr.responseText);
} else {　
console.log('上传堕落');
}
};
// 获取上传进度
xhr.upload.onprogress = function(event) {
console.log(event.loaded)
console.log(event.total)
if (event.lengthComputable) {
var percent = Math.floor(event.loaded / event.total * 100);
doc 大专栏  AJAX学习小结ument.querySelector("#progress .progress-item").style.width = percent + "%";
// 设置进度显示
console.log(percent)
}
};
xhr.send(fd);
 
请简述 AJAX 及根基法式？

简述 AJAX：AJAX即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。通过在后台与处事器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不从头加载整个网页的情况下，对网页的某部分进行更新。

Ajax应用场景

Ajax的特点在于异步交互，动态更新web页面，因此它的适用范畴是交互较多，频繁读取数据的web应用。
场景1. 用Ajax进行数据验证
场景2.按需取数据
场景3.自动更新页面

AJAX的长处

通过异步模式，提升了用户体验

优化了浏览器和处事器之间的传输，减少不须要的数据往返，减少了带宽占用

Ajax在客户端运行，承当了一部分原出处处事器承当的事情，减少了大用户量下的处事器负载。AJAX的错误谬误1.ajax不撑持浏览器back按钮。
2.安适问题 AJAX袒露了与处事器交互的细节。
3.对搜索引擎的撑持对照弱。
4.粉碎了措施的异常机制。
5.不容易调试。
6.跨域请求有必然限制。解决方法：jsonp。readyState属性状态有5个可取值： 0=未初始化 ，1=正在加载 2=已加载，3=交互中，，4=完成AJAX请求中，readyStatus的状态有哪些0: 未打开, open()要领未挪用。
1: 未发送, send()要领未挪用。
2: 已获取响应头, send()要领已被挪用，响应头和响应状态已经返回。
3: 正不才载响应体, responseText已经获取了部分数据。
4: 请求完成，整个请求过程结束了。AJAX 根基法式：//初始化ajax东西
var xhr = new XMLHttpRequest();
//连接地点，筹备数据
xhr.open(“方法”,”地点”,是否为异步);
//接收数据完成触发的事件
xhr.onload =function(){}
//发送数据
xhr.send();AJAX的交互模型ajax的事情道理相当于在用户和处事器之间加了一其中间层，使用户操纵与处事器响应异步化。它在客户端创建Ajax引擎，把传统方法下的一些处事器担负的事情转移到客户端，便于客户端资源来出来，减轻处事器和带宽的承担。

AJAX学习小结

标签：

原文地点：https://www.cnblogs.com/lijianming180/p/12251168.html