浏览器发送http请求的三种方式与Ajax技术原理

1、输入网址（请求载入页面）

2、提交表单（发送数据并载入页面）

<form action="ok.html" method="post">

<!--name 的值可以任意，但是不要使用关键字-->

用户名:<input type="text" name="username"/><br/>

密　码:<input type="password" name="password"/><br/>

<input type="submit" value="登录系统"/>

<input type="reset" value="重新填写"/>

</form>

tip：以上两种方法发送http请求时，页面都会刷新

3、用XMLHttpRequest对象发送异步HTTP请求（此时页面不会刷新）

 

异步刷新技术Ajax（Asynchronous JavaScript and xml）

1、其本质就是异步刷新页面的局部区域

2、传统web应用程序一个http请求对应一个页面且加载页面时用户必须等待

而通过Ajax异步技术，在浏览器与服务器交互的过程中，用户仍然可以在浏览器中进行一些其他操作

3、Ajax原理：将服务器响应http请求回执的html片段或字符串加载到页面特定的容器中

4、XMLHttpRequest对象的工作过程

　　初始化XMLHttpRequest对象，通过该对象发送异步请求-->创建对象实例

　　监听服务器响应-->open()方法指定载入文档请求、send()方法发送请求

　　放回响应-->使用onreadystatechange事件监听服务器

　　用容器元素载入响应内容-->使用dom元素载入服务器放回的内容