ajax是什么?

是一种创建交互式网页应用的一种网页技术。简单来说,就是向服务器发起请求,获得数据使交互性和用户体验更好。

ajax不是一种新的技术,是一些技术的集合体。有

1.XHTML和CSS

2.使用文档的对象模型DOM做动态显示和交互

3.使用XML和XSLY做数据交互和操作。

4.使用XMLHttpRequest将他们绑定到一起

ajax提供了异步与服务器通讯的功能,从而让用户在请求响应的的循环中解脱出来。当用户点击按钮的时候,

javascript和html立即更新ui,向服务器发起异步请求,当接收到服务器返回的数据后,就进行页面的更新。

这种技术,不会刷新整个页面。

ajax工作原理

简单的来说,ajax是通过XMLHttpReequest对象,向服务器发起异步请求,返回请求回来的数据,javascript来操作Dom渲染ui,关键的地方是,XMLHTTPRequire获得数据的过程。

先说一下XMLHTTPRequire对象的属性

1、readyState

HTTP 请求的状态.当一个 XMLHttpRequest 初次创建时,这个属性的值从 0 开始,直到接收到完整的 HTTP 响应,这个值增加到 4。

0 Uninitialized 初始化状态。XMLHttpRequest 对象已创建或已被 abort() 方法重置。
1 Open open() 方法已调用,但是 send() 方法未调用。请求还没有被发送。
2 Sent Send() 方法已调用,HTTP 请求已发送到 Web 服务器。未接收到响应。
3 Receiving 所有响应头部都已经接收到。响应体开始接收但未完成。
4 Loaded HTTP 响应已经完全接收。

readyState 的值不会递减,除非当一个请求在处理过程中的时候调用了 abort() 或 open() 方法。每次这个属性的值增加的时候,都会触发 onreadystatechange 事件句柄。

2、responseText

目前为止为服务器接收到的响应体(不包括头部),或者如果还没有接收到数据的话,就是空字符串。

如果 readyState 小于 3,这个属性就是一个空字符串。当 readyState 为 3,这个属性返回目前已经接收的响应部分。如果 readyState 为 4,这个属性保存了完整的响应体。

如果响应包含了为响应体指定字符编码的头部,就使用该编码。否则,假定使用 Unicode UTF-8。

3、responseXML

对请求的响应,解析为 XML 并作为 Document 对象返回。

4、status

由服务器返回的 HTTP 状态代码,如 200 表示成功,而 404 表示 "Not Found" 错误。当 readyState 小于 3 的时候读取这一属性会导致一个异常。

4、statusText

这个属性用名称而不是数字指定了请求的 HTTP 的状态代码。也就是说,当状态为 200 的时候它是 "OK",当状态为 404 的时候它是 "Not Found"。和 status 属性一样,当 readyState 小于 3 的时候读取这一属性会导致一个异常。

还有很多对应的方法 可以看这里的介绍

https://www.w3school.com.cn/xmldom/dom_http.asp

ajax实例

ajax工作原理/实例的更多相关文章

  1. ajax工作原理及jsonp跨域详解

    一.Ajax简介 ajax = 异步 JavaScript 和 XML. ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术.我们知道,传统的网页(不使用ajax)如果需要更新内容, ...

  2. AJAX工作原理与缺点

    1.概念:什么是AJAXAJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是一种创建交互式网页应用的网页开发技术.2.为什么要使用他 ...

  3. Ajax工作原理和原生JS的ajax封装

    前言: 之所以用ajax作为博客的开篇,是因为无论从ajax的出现还是从它的作用上来说,ajax对于前端无疑是意义重大的.甚至可以说,是ajax带来了前端这个行业.当然,历史并不能说明当下,曾经的辉煌 ...

  4. 简要总结ajax工作原理及优缺点

    虽然在实际的项目中使用多种ajax请求,但就其工作原理,优缺点尚未深入总结, 参考:http://www.cnblogs.com/SanMaoSpace/archive/2013/06/15/3137 ...

  5. JSP+JavaBean+Servlet工作原理实例…

    JSP+JavaBean+Servlet工作原理实例讲解 首先,JavaBean和Servlet虽都是Java程序,但是是完全不同的两个概念.引用mz3226960提出的MVC的概念,即M-model ...

  6. 【java项目实践】具体解释Ajax工作原理以及实现异步验证username是否存在+源代码下载(java版)

    一年前,从不知道Ajax是什么,伴随着不断的积累,到如今常常使用,逐渐有了深入的认识. 今天,假设想开发一个更加人性化,友好,无刷新,交互性更强的网页,那您的目标一定是Ajax. 介绍 在具体讨论Aj ...

  7. ajax工作原理,Jsonp原理

    Ajax工作原理是 相当于在用户和服务器之间加了-个中间层(AJAX引擎),使用户操作与服务器响应异步化. 对于用户请求ajax引擎会做一些数据验证和数据处理,不是所有请求都提交给服务器,当需要从服务 ...

  8. Ajax工作原理及实例

    1.关于ajax的名字 ajax 的全称是Asynchronous JavaScript and XML,其中,Asynchronous 是异步的意思,它有别于传统web开发中采用的同步的方式. 2. ...

  9. AJAX工作原理及其优缺点

    1.什么是AJAX?AJAX全称为"Asynchronous JavaScript and XML"(异步JavaScript和XML),是一种创建交互式网页应用的网页开发技术.它 ...

随机推荐

  1. Scala创建SparkStreaming获取Kafka数据代码过程

    正文 首先打开spark官网,找一个自己用版本我选的是1.6.3的,然后进入SparkStreaming   ,通过搜索这个位置找到Kafka, 点击过去会找到一段Scala的代码 import or ...

  2. Python3-subprocess模块-子进程管理

    简单介绍 subprocess模块可以创建新的进程,执行shell命令.Python脚本等 代码示例 import subprocess # 1.执行进程,并获取返回码 return_code = s ...

  3. 使用docker创建rocketMQ容器

    一.rocketMQ安装 (一)安装NameSrv 1.创建nameSrv数据挂载文件夹 mkdir -p /usr/data/rocketMQ/data/namesrv/logs mkdir -p ...

  4. slow SQL

    一.介绍 慢查询日志可用于查找需要很长时间才能执行的查询,因此是优化的候选者.但是,检查长慢的查询日志可能是一项耗时的任务. 二.配置 # 查看: slow_query_log 慢SQL开关 slow ...

  5. html+css快速入门教程(3)

    练习: 1.画盒子 2.相框 5 基础选择器 5.1 id选择器 ID选择器与类选择器的定义与引用方式类似,只是定义的符号不一样.ID通常表示唯一值,因此,ID选择器在CSS 中通常只出现一次.如果出 ...

  6. mycat增加开机自启

    一.安装及配置: 见https://github.com/MyCATApache/Mycat-Server 二.增加开机自启: 1.添加开机自启脚本:vim /etc/init.d/mycat.sh, ...

  7. Nginx 从入门到放弃(二)

    学习完了nginx的基本知识后,我们来了解下nginx的虚拟主机. 说到虚拟主机,那就得说一说虚拟主机的三种方式了 基于端口的虚拟主机 基于域名的虚拟主机 基于ip的虚拟主机 基于端口实现虚拟主机 只 ...

  8. 命令 关闭SElinux

    # sed -i 's/^SELINUX=.*$/SELINUX=disabled/g' /etc/selinux/config

  9. django 缓存(memcached)

    Django提供了6种缓存方式 开发调试缓存 内存缓存 文件缓存 数据库缓存 Memcache缓存(使用python-memcached模块) Memcache缓存(使用pylibmc模块) 常使用的 ...

  10. Netflix OSS套件一站式学习驿站

    Netflix OSS是由Netflix公司主导开发的一套代码框架/库,目的是用于解决大规模集群的分布式系统的一连串问题,如:服务发现.负载均衡.熔断降级.限流.网关等.对于当代的Java开发者来说, ...