Ajax核心XMLHttpRequest对象

XMLHttpRequest对象方法

XMLHttpRequest对象属性

onreadystatechange 状态改变的事件触发器。每次 readyState 属性的改变都会触发 readystatechange事件

readyState 属性表示Ajax请求的当前状态。它的值用数字代表。

0 代表未初始化。 还没有调用 open 方法

1 代表正在加载。 open 方法已被调用,但 send 方法还没有被调用

2 代表已加载完毕。send 已被调用。请求已经开始

3 代表交互中。服务器正在发送响应

4 代表完成。响应发送完毕

AJAX运行流程

整个Ajax技术紧紧围绕在XMLHttpRequest对象周围
(1)创建XMLHttpRequest对象,XMLHttpRequest对象的作用如同名字所暗示的,允许通过客户端脚本来发送HTTP请求。
(2)XMLHttpRequest打开连接并发送数据
  服务器端响应处理阶段
(3)XMLHttpRequest获得服务器端响应状态。XMLHttpRequest对象也是一个普通的JavaScript对象,如一个普通按钮或一个普通文本框一样,可以触发事件;而XMLHttpRequest触发的事件就是onreadystatechange,当XMLHttpRequest对象的状态改变时,将触发它。为XMLHttpRequest对象的onreadystatechange事件指定事件处理函数,该函数将在XMLHttpRequest状态改变时被执行,这个事件处理函数也叫回调函数(XMLHttpRequest状态改变,且readyState=4&&status=200时,表明服务器响应已经完成且是正确的响应状态,此时可以开始处理服务器响应)
(4)客户端处理函数执行。进入事件处理函数后,XMLHttpRequest依然不可或缺,事件处理函数借助于XMLHttpRequest的responseText或responseXML属性获取服务器的响应,至此XMLHttpRequest运行周期结束;JavaScript通过DOM操作将响应动态加载到XHMTL页面中。
整个过程,从发送HTTP请求到监控服务器的响应状态,到获取响应数据,XMLHttpRequest一直是Ajax技术的灵魂。

GET 还是 POST?

与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。

然而,在以下情况中,请使用 POST 请求:

  • 无法使用缓存文件(更新服务器上的文件或数据库)
  • 向服务器发送大量数据(POST 没有数据量限制)
  • 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠

POST 请求示例:

xmlhttp.open("POST","demo_post.asp",true);
xmlhttp.send();

【ajax】1、ajax原理的更多相关文章

  1. ajax跨域原理以及解决方案

    说明 跨域主要是由于浏览器的“同源策略”引起,分为多种类型,本文主要探讨Ajax请求跨域问题 前言 强烈推荐阅读参考来源中的文章,能够快速帮助了解跨域的原理 参考来源 本文参考了以下来源 浏览器同源政 ...

  2. AJAX的工作原理及其优缺点

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

  3. 什么是ajax,ajax原理是什么 ,优缺点是什么

    AJAX工作原理及其优缺点   1.什么是AJAX?AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是一种创建交互式网页应用的网页 ...

  4. AJAX异步请求原理和过程

    AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML),它不是一种新的编程语言,而是一种使用现有标准的新方法. AJAX 基于 JavaS ...

  5. Ajax跨域原理及JQuery中的实现

    浅析Ajax跨域原理及JQuery中的实现分析   AJAX 的出现使得网页可以通过在后台与服务器进行少量数据交换,实现网页的局部刷新.但是出于安全的考虑,ajax不允许跨域通信.如果尝试从不同的域请 ...

  6. AJAX入门——工作原理

    同步和异步交互,了解互动 对于一个样本:一般B/S模式(同步)       AJAX技术(异步)        *  同步:       提交请求->等待server处理->处理完成返回 ...

  7. ecshop中ajax的调用原理 1

    ecshop中ajax的调用原理   1:首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是ajax对象文件.声明了一个va ...

  8. ECSHOP中ajax的调用原理

    ECSHOP中ajax的调用原理 ecshop中ajax的调用原理. 1.首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是 ...

  9. Ajax的工作原理以及优点、缺点 (汇总)

    最近空闲时间,有朋友问我关于Ajax的工作原理,在这里我结合自己的工作经验和网上大佬的经验做一个总结,如有不足,请各位业内大佬指正 在我们了解Ajax之前,我们先来了解一下Javascript的执行原 ...

  10. Ajax的工作原理以及优缺点

    Ajax的工作原理 : 相当于在客户端与服务端之间加了一个抽象层(Ajax引擎),使用户请求和服务器响应异步化,并不是所有的请求都提交给服务器,像一些数据验证和数据处理 都交给Ajax引擎来完成,只有 ...

随机推荐

  1. 准备在electron上用vue,结果卡在了sqlite3

    vue.js看书有一段时间了,也准备动手做一个electron的程序.目录似乎有两种方式搭建方式 一种是使用vue.cli构建工具,就是所谓的脚手架,分别安装vue和electron https:// ...

  2. [solution] JZOJ 5459. 密室

    [solution] JZOJ 5459. 密室 Description 小X 正困在一个密室里,他希望尽快逃出密室. 密室中有$N$ 个房间,初始时,小X 在1 号房间,而出口在N 号房间. 密室的 ...

  3. 通过selenium登录网页获取特定信息

    前言 最近有需求要登录网站查询一些信息,然后再修改一些信息,而且这种工作重复性很强,想着通过自动化的方式来做这个东西. 技术选择 自动化的方式开始考虑的是用python的爬虫来做,但是登录的网站有好多 ...

  4. js五道经典练习题--第五道成绩列表

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  5. ETL概念详解

    ETL是将业务系统的数据经过抽取.清洗转换之后加载到数据仓库的过程,目的是将企业中的分散.零乱.标准不统一的数据整合到一起,为企业的决策提供分析依据. ETL是BI项目重要的一个环节. 通常情况下,在 ...

  6. WITH RECOMPILE和OPTION(RECOMPILE)区别

    在考虑重编译T-SQL(或者存储过程)的时候,有两种方式可以实现强制重编译(前提是忽略导致重编译的其他因素的情况下,比如重建索引,更新统计信息等等), 一是基于WITH RECOMPILE的存储过程级 ...

  7. String的substring方法

    string.substring(beginIndex, endIndex) 左闭右开. 测试 public static void main(String[] args) { String a = ...

  8. Linux pwn入门教程——格式化字符串漏洞

    本文作者:Tangerine@SAINTSEC 原文来自:https://bbs.ichunqiu.com/thread-42943-1-1.html 0×00 printf函数中的漏洞printf函 ...

  9. [Swift]LaunchScreen.storyboard设置启动页

    设置[General]->[App Icons and Launch Images] 注意:当App不是用LaunchScreen.xib来配置启动页时,[LaunchScreen File]置 ...

  10. SQL查询去掉重复数据

    本文主要总结数据库去掉重复数据的方法 去掉重复数据的方法: 第一种:distinct 根据单个字段去重,能精确去重: 作用在多个字段时,只有当这几个字段的完全相同时,才能去重: 关键字distinct ...