Ajax中什么是同步、异步?

  • 同步:就是用户填写完信息之后,全部提交给服务器,等待服务器的回应,是一次性全部的。

  • 异步:当用户填写完一条信息之后,这条信息会自动向服务器提交,然后服务器响应客户端,在此过程中,用户依然在填写表格的信息,即向服务器请求多次,节省了用户的时间,提高了用户的体验。

Ajax三步骤:

  1. 运用HTML和CSS实现页面,表达信息;

  2. 运用XMLHttpRequest和web服务器进行数据的异步交换;

  3. 运用JavaScript操作DOM,实现动态局部刷新;

XMLHttpRequest:

1、实例化XMLHttpRequest对象:

var request=new XMLHttpRequest();
2、浏览器的支持情况:大部分浏览器都支持,但是在IE5/IE6不能支持,但是也可以通过添加代码使得IE5/IE6支持。
兼容IE6函数
var request;
if(window.XMLHttpRequest){
request = new XMLHttpRequest(); //IE7+,Firefox,Chrome,Opera,Safari...
}else{
request = new ActiveXObject("Microsoft.XMLHTTP"); //IE6,IE5
}

HTTP请求过程:

  • HTTP是计算机通过网络进行通信的规则
  • HTTP是一种无状态的协议(不建立持久的连接,服务端不保留连接的相关信息,浏览器发出请求和服务器返回响应是一个没有记忆的过程)
  • 一个完整的【HTTP请求】过程有7个步骤:
  1. 建立TCP连接
  2. Web浏览器向Web服务器发送请求命令
  3. Web浏览器发送请求头信息
  4. Web服务器应答
  5. Web服务器发送应答头信息
  6. Web服务器向浏览器发送数据
  7. Web服务器关闭TCP连接

HTTP请求 分为4部分:

  1. HTTP请求的方法或动作,post或get
  2. 正在请求的URL
  3. 请求头,包含一些客户端环境信息,身份验证信息等
  4. 请求体(请求正文),包含要发送的一些字符串信息,表单信息等等

  //请求头和请求体之间有一个空行,表面请求头已经结束

GET   :一般用于信息的获取,使用URL传递参数,对发送信息的数量也有限制,一般在2000字符!

默认方式,一般用于查询、获取操作,不是很安全,任何人可见,信息都显示在URL中
  POST:一般用于修改服务器上的资源,对所发送的数量无限制。

一般用于发送表单数据,新建,修改,删除等操作,要安全一些,不在URL中显示,对其他人不显示。

【幂等】:一个操作任意多次执行所产生的影响均与一次执行的影响相同。GET请求就是一种幂等操作。

HTTP响应 由3部分组成:

  • ①一个数字或文字组成的状态码,用来显示请求是成功还是失败
  • ②响应头,和请求头一样包含许多有用信息,如服务器类型、日期时间、内容类型和长度等
  • ③响应体,即响应正文//响应头和响应体之间有空行

HTTP状态码:

  • 1XX:信息类,表示收到Web浏览器请求,正在进一步处理中
  • 2XX:成功,表示用户请求被正确接收
  • 3XX:重定向,表示请求没有成功,客户必须采取进一步动作
  • 4XX:客户端错误,表示客户端提交的请求有错误,例如:404 NOT Found,意味着请求中所引用的文档不存在
  • 5XX:服务器错误,表示服务器不能完成对请求的处理,如:500

XMLHttpRequest发送请求:

两个方法
open(method,url,async)
method:规定HTTP发送请求的方式是get还是post,不区分大小写,一般来说用大写
url:请求地址(相对地址或绝对地址)
async:同步/异步(false/true),默认是异步也就是true,可以不用填写

send(string):发送到服务器(该参数可以填或者不填-----get方法不填或填null,post:一般要填)

例如:
request.open("POST","create.php",true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded ")//设置HTTP头信息--一定要写在open()和send()之间
request.send("name=xxxx&set=xxx");

Ajax的那点事的更多相关文章

  1. jQuery源码分析系列(30) : Ajax 整体结构

    开头引用一段 想起一句话:前端研究,研究个屁~ 的确如此呀.补充下联:前端设计,设计个屁~ 前端目前最大的困境是,如 HTML 一样,无论你承不承认,市场上并不太需要 HTML 高手 其实这里引发一个 ...

  2. jQuery ajax submit form 被拦截问题的解决

    一般情况下用js或jquery的submit方法提交form表单是不会被浏览器拦截的,但是发现异步的情况下用js提交form表单就会被浏览器拦截,这样就对功能的实现带来了很多的麻烦.网上看了好多都是同 ...

  3. Jquery ajax中表单提交被拦截的问题处理方法

    在实际开发项目中,由于要做支付宝的批量退款处理,需要用到ajax中去提交表单数据,项目截图如下: 由于在第二张截图“确认退款”那里需要异步ajax提交数据到服务器处理信息,处理成功后将返回的数据装载到 ...

  4. js的AJAX请求有关知识总结

    什么是AJAX?AJAX作用是什么? async javascript and xml(异步的javascript和xml) 作用:实现局部刷新 async:我们真实项目中一般使用AJAX从服务器端获 ...

  5. jQuery架构设计与实现(2.1.4版本)

    市面上的jQuery书太多了,良莠不齐,看了那么多总觉得少点什么 对"干货",我不喜欢就事论事的写代码,我想把自己所学的知识点,代码技巧,设计思想,代码模式能很好的表达出来,所以考 ...

  6. javaWeb - 1 — servlet — 更新完毕

    1.先来聊一些javaWeb相关的知识 简单了解一下:web的发展史 1).web就是网页的意思嘛 2).web的分类 (1).静态web 使用HTML.CSS技术,主要包括图片和文本 优点:简单,只 ...

  7. 关于AJAX的一些事

    在JQ中运用AJAX的操作是很舒服的一件事,一直以来我对他都有个错误的认识,直到遇见了问题才把他研究个透彻. 下面贴出两种AJAX的写法,当然都是正确的. 其一: $.ajax({ type: 'po ...

  8. scrapy实战4 GET方法抓取ajax动态页面(以糗事百科APP为例子):

    一般来说爬虫类框架抓取Ajax动态页面都是通过一些第三方的webkit库去手动执行html页面中的js代码, 最后将生产的html代码交给spider分析.本篇文章则是通过利用fiddler抓包获取j ...

  9. (二)关于ajax那些事

    哈哈,今天突然兴起,想了想自己对ajax的了解,来这里叙述下.心情好,嘿嘿嘿 ajax是一种创建交互式网页应用的网页开发技术.就是在不重新加载页面的情况下,更新部分网页. ajax原理:ajax就是相 ...

随机推荐

  1. knn算法手写字识别案例

    import pandas as pd import numpy as np import matplotlib.pyplot as plt import os from sklearn.neighb ...

  2. GNU MAKE 笔记

    最近在调试OJ, 忙了4天多, 最后的问题是judge模块不能正常工作. judge 模块就是两个C++源文件, 它的工作是 从数据库获取用户提交的源码 测评 将测评结果写到数据库 测评部分是与数据库 ...

  3. [Bzoj1009][HNOI2008]GT考试(动态规划)

    题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=1009 显而易见的动态规划加矩阵快速幂,不过转移方程不怎么好想,dp[i][j]表示长度为 ...

  4. [Codeforces 555E]Case of Computer Network(Tarjan求边-双连通分量+树上差分)

    [Codeforces 555E]Case of Computer Network(Tarjan求边-双连通分量+树上差分) 题面 给出一个无向图,以及q条有向路径.问是否存在一种给边定向的方案,使得 ...

  5. 查找idt table 所對應的page table in Linux

    #include <linux/kernel.h> #include <linux/module.h> #include <linux/types.h> #incl ...

  6. 专题:性能调优之工具---perf

    1. Linux Perf简介 1.1 Perf是什么 Perf 是内置于Linux 内核源码树中的性能剖析(profiling)工具.它基于事件采样原理,以性能事件为基础,支持针对处理器相关性能指标 ...

  7. day50 初识JavaScript

    一.背景介绍 (一)web开发的三种样式: 结构:HTML:从语义的角度,描述页面结构 样式:CSS:从审美的角度,描述样式(美化页面) 行为(动态)JavaScript:从交互的角度,描述行为(用于 ...

  8. 【学习总结】Python-3-Python数字运算与数学函数

    菜鸟教程-Python3-Python数字 注:这一节链接中的内容比较多,表格中的具体函数耐心点进去看看 1-变量在使用前必须先"定义"(即赋予变量一个值),否则会出现错误 2-不 ...

  9. sessionStorage 使用方法

    作为html5中Web Storage的一种存储方式,localStorage和sessionStorage一样都是用来存储客户端临时信息的对象. W3c上给的介绍是这两者区别在于前者用于持久化的本地 ...

  10. bounds与frame的区别及setBounds的使用

    转自http://www.cocoachina.com/ios/20140925/9755.html 在iOS开发中经常遇到两个词Frame和bounds,本文主要阐述Frame和bound的区别,尤 ...