ajax是什么?如何使用ajax?
1. AJAX的全称是Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。
2. ajax不是新的编程语言,而是一种使用现有标准的新方法。
3. ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。而传统的网页(不使用ajax)如果需要更新内容,必须重载整个网页面。
ajax的优点:
1、最大的一点是页面无刷新,用户的体验非常好。
2、使用异步方式与服务器通信,具有更加迅速的响应能力。。
3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。
并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。
4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
5、ajax可使因特网应用程序更小、更快,更友好。
ajax的缺点:
1、ajax不支持浏览器back按钮。
2、安全问题 AJAX暴露了与服务器交互的细节。
3、对搜索引擎的支持比较弱。
4、破坏了程序的异常机制。
5、不容易调试。
ajax: function (option) {
//1.创建异步对象
var xhr = new XMLHttpRequest();
// url 可能需要拼接
if (option.type == 'get') {
option.url += '?';
option.url += option.data;
// 如果 这里 使用了 data 那么 send 这个方法中 null
option.data = null;
}
//2.设置属性(请求头,请求行)
xhr.open(option.type, option.url);
// 设置 请求头
if (option.type == 'post') {
xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
}
//4.注册状态改变事件
xhr.onreadystatechange = function () {
//5.判断状态&请求是否成功并使用数据
if (xhr.readyState == 4 && xhr.status == 200) {
// xhr 异步对象中 有一个 方法
// 获取响应报文的 响应头中的 某些信息 这里我们获取了 content-type的值
// 从而 获取 到底是 json 还是 xml 返回不同的数据 给用户
var value = xhr.getResponseHeader('Content-Type');
// 如果有 xml
if (value.indexOf('xml') != -1) {
// 如果有xml 就返回xml
option.success(xhr.responseXML);
} else if (value.indexOf('json') != -1) {
// 如果是json数字据 那么 帮忙 把转换的操作也做了
option.success(JSON.parse(xhr.responseText));
} else {
option.success(xhr.responseText);
}
}
}
//3.发送请求 请求主体
// 数据 放在 这里 发送
xhr.send(option.data);
}
}
ajax的get方式和post方式有什么区别
最简单的区别:
1.使用Get请求时,参数在URL中显示,而使用Post方式,则不会显示出来
2.使用Get请求发送数据量小,Post请求发送数据量大
3.get请求需注意缓存问题,post请求不需担心这个问题
Get方式:
用get方式可传送简单数据,但大小一般限制在1KB下,数据追加到url中发送(http的header传送),
也就是说,浏览器将各个表单字段元素及其数据按照URL参数的格式附加在请求行中的资源路径后面。
另外最重要的一点是,它会被客户端的浏览器缓存起来,那么,别人就可以从浏览器的历史记录中,读取到此客户的数据,比如帐号和密码等。
因此,在某些情况下,get方法会带来严重的安全性问题。
Post方式:
当使用POST方式时,浏览器把各表单字段元素及其数据作为HTTP消息的实体内容发送给Web服务器,而不是作为URL地址的参数进行传递,
使用POST方式传递的数据量要比使用GET方式传送的数据量大的多。
网友评论