前言:
作为一名资深球迷,提起阿贾克斯,首先想到的就是曼联,那种足总杯知名球员能否异步加载elementUI,培养过伊布、范德法特、苏亚雷斯、亨特拉尔等众多巨星的球队。
其实明天我们要说的阿贾克斯和篮球没有任何关系。 我们谈论的就是这个Ajax:Asynchronous JavaScript And XML(异步JavaScript和XML)。
Ajax 不是一种编程语言,它指的是一种交互方法:客户端和服务器交换数据并更新部分网页而不重新加载整个页面的技术。
Ajax的核心是异步加载或部分刷新。
什么是部分刷新? 通过直观的例子来学习。
需要
2、同时在输入框中输入信息。
3、服务器返回“haha”字符串,并将结果显示在页面上。
传统方法会刷新整个页面:
点击提交按钮后,在输入框中输入内容时服务器会做出响应。 结果会通过重新加载整个页面并同步加载来显示,因此输入框中输入的所有内容都会被清除。
Ajax部分刷新:
点击提交按钮后,在输入框中输入内容,服务器响应。 仅动态刷新网页中要显示结果的部分。 不会影响输入框的输入。 结果显示和输入同时进行,互不干扰。 异步加载。
传统Web数据交互VSAjax数据交互
客户请求表格不同:
传统:浏览器发送同步请求。
Ajax:异步引擎对象发送请求。
服务器响应方式不同:
传统:响应整页 (JSP)。
Ajax:响应所需的数据。
客户端处理方式不同:
传统:用户需要等待服务器响应完成并重新加载整个页面,然后才能执行操作。
Ajax:动态更新页面本地内容能否异步加载elementUI,不影响页面上的其他用户操作。
Ajax原理
Ajax的工作原理相当于在客户端和服务器之间添加了一个中间层,使得用户操作和服务器响应异步。 并非所有用户请求都会提交到服务器。 一些数据验证和数据处理留给Ajax引擎本身。 只有当确定需要从服务器读取新数据时,Ajax引擎才会代其向服务器提交请求。
Ajax技术的核心:XMLHttpRequest
常用方法:
1.open() 创建一个新的 HTTP 请求。
2.send()将请求发送到服务器。
常用的干扰:
onreadystatechange:指定反弹功能。
共同属性:
ReadyState:XMLHttpRequest 状态信息。
状态码含义: