2022AJAX 常见面试题分享

1、什么是 AJAX，为什么要使用 Ajax（请谈一下你对 Ajax 的认识）

什么是 ajax：

AJAX 是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。

Ajax 包含下列技术：

基于 web 标准（standards-basedpresentation）XHTML+CSS 的表示；

使用 DOM（Document ObjectModel）进行动态显示及交互；

使用 XML 和 XSLT 进行数据交换及相关操作；

使用 XMLHttpRequest 进行异步数据查询、检索；

使用 JavaScript 将所有的东西绑定在一起。

2、为什么要用 ajax：

Ajax 应用程序的优势在于：

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

2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用

3. Ajax 引擎在客户端运行，承担了一部分本来由服务器承担的工作，从而减少了大用户量下的服务器负载。

2、AJAX 最大的特点是什么。

Ajax 可以实现动态不刷新（局部刷新）

就是能在不更新整个页面的前提下维护数据。这使得 Web 应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改变过的信息。

3、Ajax 的实现流程是怎样的？

(1)创建 XMLHttpRequest 对象,也就是创建一个异步调用对象.

(2)创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL 及验证信息.

(3)设置响应 HTTP 请求状态变化的函数.

(4)发送 HTTP 请求.

(5)获取异步调用返回的数据.

(6)使用 JavaScript 和 DOM 实现局部刷新.

4、Ajax 解决浏览器缓存问题？

1、在 ajax 发送请求前加上 anyAjaxObj.setRequestHeader("If-Modified-Since","0")。

2、在 ajax 发送请求前加上 anyAjaxObj.setRequestHeader("Cache-Control","no-cache")。

3、在 URL 后面加上一个随机数： "fresh=" + Math.random();。

4、在 URL 后面加上时间戳："nowtime=" + new Date().getTime();。

5、如果是使用 jQuery，直接这样就可以了 $.ajaxSetup({cache:false})。这样页面的所有 ajax 都会执行这条语句就是不需要保存缓存记录。 

5、请介绍一下 XMLhttprequest 对象。

Ajax 的核心是 JavaScript 对象 XmlHttpRequest。该对象在 Internet Explorer 5 中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest 使您可以使用 JavaScript 向服务器提出请求并处理响应，而不阻塞用户。通过 XMLHttpRequest 对象，Web 开发人员可以在页面加载以后进行页面的局部更新。

6、AJAX 技术体系的组成部分有哪些。

HTML，css，dom，xml，xmlHttpRequest，javascript

7、AJAX 应用和传统 Web 应用有什么不同。

在传统的 Javascript 编程中，如果想得到服务器端数据库或文件上的信息，或者发送客户端信息到服务器，需要建立一个 HTML form 然后 GET 或者 POST 数据到服务器端。用户需要点击”Submit”按钮来发送或者接受数据信息，然后等待服务器响应请求，页面重新加载。

因为服务器每次都会返回一个新的页面， 所以传统的 web 应用有可能很慢而且用户交互不友好。

使用 AJAX 技术， 就可以使 Javascript 通过 XMLHttpRequest 对象直接与服务器进行交互。

通过 HTTP Request， 一个 web 页面可以发送一个请求到 web 服务器并且接受 web 服务器返回的信息(不用重新加载页面)，展示给用户的还是通一个页面，用户感觉页面刷新，也看不到到 Javascript 后台进行的发送请求和接受响应。

8、AJAX 请求总共有多少种 CALLBACK。

Ajax 请求总共有八种 Callback

onSuccess

onFailure

onUninitialized

onLoading

onLoaded

onInteractive

onComplete

onException

9.Ajax 和 javascript 的区别。

javascript 是一种在浏览器端执行的脚本语言，Ajax 是一种创建交互式网页应用的开发技术 ，它是利用了一系列相关的技术其中就包括 javascript。

Javascript 是由网景公司开发的一种脚本语言，它和 sun 公司的 java 语言是没有任何关系的，它们相似的名称只是一种行销策略。

在一般的 web 开发中，javascript 是在浏览器端执行的，我们可以用 javascript 控制浏览器的行为和内容。

在 Ajax 应用中信息是如何在浏览器和服务器之间传递的

通过 XML 数据或者字符串

10、在浏览器端如何得到服务器端响应的 XML 数据。

XMLHttpRequest 对象的 responseXMl 属性 

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

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

12、介绍一下 XMLHttpRequest 对象的常用方法和属性。

open(“method”,”URL”) 建立对服务器的调用，第一个参数是 HTTP 请求    方式可以为 GET，POST 或任何服务器所支持的您想调用的方式。

 第二个参数是请求页面的 URL。

    send()方法，发送具体请求

    abort()方法，停止当前请求

    readyState 属性   请求的状态 有 5 个可取值 0=未初始化 ，1=正在加载

    2=以加载，3=交互中，4=完成

    responseText 属性  服务器的响应，表示为一个串

    reponseXML 属性 服务器的响应，表示为 XML

    status   服务器的 HTTP 状态码，200 对应 ok  400 对应 not found

13、什么是 XML

XML 是扩展标记语言，能够用一系列简单的标记描述数据

14、XML 的解析方式

常用的用 dom 解析和 sax 解析。dom 解析是一次性读取 xml 文件并将其构造为 DOM 对象供程序使用，优点是操作方便，但是比较耗内存。Sax 是按事件驱动的方式解析的，占用内存少，但是编程复杂 

15、你采用的是什么框架（架包）

   这题是必问的，一般也是最开始就会问到。

   在 java 中比较流行的有 dojo, Prototype , JQuery, Dwr, extjs  等等

16、如果熟悉某种 ajax 框架，他可能会问到怎样在程序中使用这种框架

DWR 框架介绍

DWR(DirectWeb Remoting)是一个 WEB 远程调用框架.利用这个框架可以让 AJAX 开发变得很简单.利用 DWR 可以在客户端利用 JavaScript 直接调用服务端的 Java 方法并返回值给 JavaScript 就好像直接本地客户端调用一样(DWR 根据 Java 类来动态生成 JavaScrip 代码).

DWR 的实现原理是通过反射，将 java 翻译成 javascript，然后利用回调机制，从而实现了 javascript 调用 Java 代码

17、介绍一下 Prototype 的()函数，()函数，()函数，F()函数，$A()函数都是什么作用

$() 方法是在 DOM 中使用过于频繁的 document.getElementById() 方法的一个便利的简写，就像这个 DOM 方法一样，这个方法返回参数传入的 id 的那个元素。

$F()函数是另一个大收欢迎的“快捷键”，它能用于返回任何表单输入控件的值，比如 textbox,drop-down list。这个方法也能用元素 id 或元素本身做为参数。

$A()函数能把它接收到的单个的参数转换成一个 Array 对象。

18、介绍一下 XMLHttpRequest 对象

通过 XMLHttpRequest 对象，Web 开发人员可以在页面加载以后进行页面的局部更新。

AJAX 开始流行始于 Google 在 2005 年使用的”Google Suggest”。

“Google Suggest”就是使用 XMLHttpRequest 对象来创建动态的 Web 接口：

当用户开始输入 google 的搜索框，Javascript 发送用户输入的字符到服务器，然后服务器返回一个建议列表。

XMLHttpRequest 对象在 IE5.0+, Safari 1.2, Mozilla1.0/Firefox, Opera 8+ 和 NetScapt7 开始被支持。

19、AJAX 的全称是什么？ 介绍一下 AJAX？

AJAX 的全称是 Asynchronous JavaScript And XML.

AJAX 是 2005 年由 Google 发起并流行起来的编程方法， AJAX 不是一个新的编程语言，但是它是一个使用已有标准的新的编程技术。

使用 AJAX 可以创建更好，更快，更用户界面友好的 Web 应用。

AJAX 技术基于 Javascript 和 HTTP Request. 

20、Ajax 主要包含了哪些技术？

Ajax（Asynchronous JavaScript + XML）的定义

基于 web 标准（standards-based presentation）XHTML+CSS 的表示；

使用 DOM（Document Object Model）进行动态显示及交互；

使用 XML 和 XSLT 进行数据交换及相关操作；

使用 XMLHttpRequest 进行异步数据查询、检索；

使用 JavaScript 将所有的东西绑定在一起。英文参见 Ajax 的提出者 Jesse James Garrett 的原文,原文题目(Ajax: A New Approach to Web Applications)。

类似于 DHTML 或 LAMP，AJAX 不是指一种单一的技术，而是有机地利用了一系列相关的技术。事实上，一些基于 AJAX 的“派生/合成”式（derivative/composite）的技术正在出现，如“AFLAX”。

AJAX 的应用使用支持以上技术的 web 浏览器作为运行平台。这些浏览器目前包括：Mozilla、Firefox、Internet Explorer、Opera、Konqueror 及 Safari。但是 Opera 不支持 XSL 格式对象，也不支持 XSLT。

21、AJAX 都有哪些优点和缺点？

优点：

1、最大的一点是页面无刷新，用户的体验非常好。

2、使用异步方式与服务器通信，具有更加迅速的响应能力。

3、可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax 的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。

4、基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

缺点：

1、ajax 不支持浏览器 back 按钮。

2、安全问题 AJAX 暴露了与服务器交互的细节。

3、对搜索引擎的支持比较弱。

4、破坏了程序的异常机制。

5、不容易调试。

22、原生 js ajax 请求有几个步骤？分别是什么

常用的 post,get,delete。不常用 copy、head、link 等等。

代码上的区别

1:get 通过 url 传递参数

2:post 设置请求头 规定请求数据类型

使用上的区别

1:post 比 get 安全 (因为 post 参数在请求体中。get 参数在 url 上面)

2:get 传输速度比 post 快 根据传参决定的。 (post 通过请求体传参，后台通过数据流接收。速度稍微慢一些。而 get 通过 url 传参可以直接获取)

3:post 传输文件大理论没有限制 get 传输文件小大概 7-8k ie4k 左右

4:get 获取数据 post 上传数据 (上传的数据比较多 而且上传数据都是重要数据。所以不论在安全性还是数据量级 post 是最好的选择)

23、跨域解决方案有哪些？

（1）jsonp 只能解决 get 跨域(问的最多)

原理：动态创建一个 script 标签。利用 script 标签的 src 属性不受同源策略限制。因为所有的 src 属性和 href 属性都不受同源策略限制。可以请求第三方服务器数据内容。

步骤：

1. 去创建一个 script 标签

2. script 的 src 属性设置接口地址

3. 接口参数,必须要带一个自定义函数名 要不然后台无法返回数据。

4. 通过定义函数名去接收后台返回数据

（2）CORS：跨域资源共享

原理：服务器设置 Access-Control-Allow-OriginHTTP 响应头之后，浏览器将会允许跨域请求

限制：浏览器需要支持 HTML5，可以支持 POST，PUT 等方法兼容 ie9 以上

（3）设置 document.domain

原理：相同主域名不同子域名下的页面，可以设置 document.domain 让它们同域

限制：同域 document 提供的是页面间的互操作，需要载入 iframe 页面

（4）用 Apache 做转发（逆向代理），让跨域变成同域

关键词：前端培训