Ajax的使用方法

 1,什么是Ajax?

    Ajax(异步Javascript和XML),是指一种创建交互式网页应用的网页开发技术。

    2,Ajax的作用

    Ajax可以使网页实现异步更新----即在不更新整个页面的情况下实现对某一部分进行更新。

    简单来说Ajax就是用于连接服务器的一种工具。

    3, Ajax所包含的技术

      Ajax并非一种新的技术,而是几种原有技术的结合体。 以下便是Ajax所包含的技术

                (1).使用CSS和XHTML来表示

                (2).使用DOM模型来交互和动态显示

                (3).使用XMLHttpRequest来和服务进行异步通信

                (4).使用javascript来绑定和调用

    4,Ajax的工作原理(如图所示)

 (1)用户在Web页面上执行了某个操作,比如鼠标单击每个链接或按钮等。

  (2)根据用户的操作,触发事件的发生,并调用注册到该事件的JavaScript事件处理函  数。在JavaScript事件处理函数中,需要创建并初始化一个用以向服务器发送异步请求XMLHttpRequest对象,同时指定一个回调函数。当服务器端响应返回时,将自动调用该回调函数。

 (3)  服务器收到XMLHttpRequest对象的请求后,根据请求进行一系列的处理。

(4)处理完毕,服务器端向客户端返回所需要的数据,数据格式通常是HTML,XML,JSON。

(5)数据到达客户端之后执行JavaScript回调函数,在回调函数中将处理返回的数据,并将数据显示在用户界面。这时,站在用户的角度来说,用户获得自己操作所需的数据,并看到界面中某部分内容的更新。由于是异步更新,并没有重新加载页面,所以具有很高的用户交互性,用户几乎察觉不到延迟。

5,Ajax的核心

使用的 XMLHttpRequest 对象,但是需要注意的是——不同的浏览器创建 XMLHttpRequest 对象的方法是有差异的

    ​ 如:IE浏览器使用 ActiveXObject,而其他浏览器则使用 XMLHttpRequest的 javascript 的内建对象

6,Ajax的使用步骤:

(1)创建xhr new XMLHttpRequest();

(2)、创建请求, xhr.open(method,url,isAsyn);

(3)、设置回调函数, onreadystatechange();

(4)、发送请求, xhr.send();

7,JSON语法是JavaScript对象表示语法的子集。

l 数据在键值对中
l 数据由逗号分隔
l 花括号保存对象
l 方括号保存数组

例如使用JSON来表示输入的账号及密码,如图所示,注意其中键应当放置在双引号中。

8,Ajax的封装

   名称

/描述

type

规定请求的类型(GETPOST)。

url

规定发送请求的URL。默认是当前页面。

data

规定要发送到服务器的数据。

timeout

设置本地的请求超时时间(以毫秒计)。

success(result,status,xhr)

当请求成功时运行的函数。

error(xhr,status,error)

如果请求失败要运行的函数。

beforeSend(xhr)

发送请求前运行的函数。

complete(xhr,status)

请求完成时运行的函数(在请求成功或失败之后均调用,即在 success error 函数之

相关推荐

  1. 使用Ajax优点

    2023-12-06 16:34:06       11 阅读
  2. Ajax请求方式

    2023-12-06 16:34:06       11 阅读
  3. webform使用ajax访问后端接口两种方法

    2023-12-06 16:34:06       38 阅读
  4. ajax请求假数据方法

    2023-12-06 16:34:06       37 阅读
  5. 使用ajax异步获取下拉列表

    2023-12-06 16:34:06       33 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-06 16:34:06       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-06 16:34:06       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-06 16:34:06       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-06 16:34:06       20 阅读

热门阅读

  1. 被DDOS了怎么办 要如何应对

    2023-12-06 16:34:06       36 阅读
  2. Python压缩、解压文件

    2023-12-06 16:34:06       37 阅读
  3. get schema DDL

    2023-12-06 16:34:06       28 阅读
  4. MSS和MTU的关系

    2023-12-06 16:34:06       41 阅读
  5. thinkphp控制器调用脚本

    2023-12-06 16:34:06       36 阅读
  6. Three.js的THREE.LOD如何加载gltf模型

    2023-12-06 16:34:06       39 阅读
  7. pytorch学习4-简易卷积实现

    2023-12-06 16:34:06       42 阅读
  8. BiLSTM-CRF的中文命名实体识别

    2023-12-06 16:34:06       37 阅读
  9. 关于STM32G0 FLASH 写入时出现PGSERR的一种处理办法

    2023-12-06 16:34:06       39 阅读
  10. 管理Android12系统的WLAN热点

    2023-12-06 16:34:06       30 阅读