ajax相关知识点和面试题。

墨蓝 2022-12-20 06:11 169阅读 0赞

**Ajax是不能跨域操作的**

**协议、域名、端口都相同才同域，否则都是跨域**

## 1、用jquery封装的ajax ##

$.ajax({   
      cache ：false,    //是否在缓存中读取数据，默认为true
      type : "post",     //请求类类型
      url : "haha",  	//接口地址
      datatype : 'json'，  //服务器返回的数据类型
      success : function(data) {     //成功时的回调函数
           
      }  
    });

datatype服务器返回的数据类型有多种：  
xml、html、script、JSON、jsonp、text

cache属性是true（默认值）时：在第一次请求完成之后，如果地址和参数不变化，第二次去请求，会默认获取缓存中的数据，不去读取服务器端的最新数据。  
cache属性是flase（默认值）时：每次读取的是最新的数据。  
ajax缓存只对GET方式的请求有效，因为浏览器认为POST请求提交的内容必定有变化，所以不走缓存。

## 2、原生的ajax的创建 ##

//创建 XMLHttpRequest 对象
    var ajax = new XMLHttpRequest();
    //规定请求的类型、URL 以及是否异步处理请求。
    ajax.open('GET',url,true);
    //发送信息至服务器时内容编码类型
    ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    //发送请求
    ajax.send(null);  
    //接受服务器响应数据
    ajax.onreadystatechange = function () { 
        if (obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) {  
        }
    };

3、XMLHttpRequest对象的常用方法和属性

方法：  
open()：该方法创建http请求  
第一个参数是指定提交方式(post、get)  
第二个参数是指定要提交的地址是哪  
第三个参数是指定是异步还是同步(true表示异步，false表示同步)  
第四和第五参数在http认证的时候会用到。是可选的  
setRequestHeader()：设置消息头（使用post方式才会使用到，get方法并不需要调用该方法）

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

send(content)：发送请求给服务器  
如果是get方式，并不需要填写参数，或填写null  
如果是post方式，把要提交的参数写上去

属性：  
onreadystatechange：请求状态改变的事件触发器（readyState变化时会调用此方法），一般用于指定回调函数  
readyState：请求状态readyState一改变，回调函数被调用，它有5个状态  
0：未初始化，还没有调用open方法。  
1：open方法调用成功，send方法还未调用。  
2：send方法调用成功，还未开始传输数据。  
3：正在接收数据。Http响应头信息已经接收，但尚未完成。  
4：完成。数据接收完成

responseText：服务器返回的文本内容  
responseXML：服务器返回的兼容DOM的XML内容  
status：服务器返回的状态码  
statusText：服务器返回状态码的文本信息

**4、什么是ajax**  
异步的js和xml ，是一种用于创建快速动态网页的技术。可以在【不必刷新整个浏览器】的情况下，与服务器进行异步通讯的技术

**ajax的原理？**  
Ajax相当于在用户和服务器之间加了一个中间层,使用户操作与服务器响应异步化。  
简单来说通过XmlHttpRequest对象来向服务器发送异步请求，从服务器获得数据，然后用js来操作DOM而更新页面。

**XMLhttprequest对象**

XMLHttpRequest是ajax的核心机制。它是一种支持异步请求的技术。也就是javascript可以及时向服务器提出请求和处理响应，而不阻塞用户。通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新，达到无刷新的效果。

**XMLHttpRequest对象在IE和Firefox中创建方式有没有不同。**

**有，IE中通过new ActiveXObject()得到，Firefox中通过newXMLHttpRequest()得到**