AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。Ajax不是一种新的编程语言,而是使用现有标准的新方法。AJAX可以在不重新加载整个页面的情况下,与服务器交换数据。这种异步交互的方式,使用户单击后,不必刷新页面也能获取新数据。使用Ajax,用户可以创建接近本地桌面应用的直接、高可用、更丰富、更动态的Web用户界面。
Ajax包括:
利用AJAX可以做:
ajax伪造iframe就是我们常用的iframe标签:<iframe>。iframe标签是框架的一种形式,也比较常用到,iframe一般用来包含别的页面,例如我们可以在我们自己的网站页面加载别人网站或者本站其他页面的内容。iframe标签的最大作用就是让页面变得美观。iframe标签的用法有很多,主要区别在于对iframe标签定义的形式不同,例如定义iframe的长宽高。
因此,iframe标签具有局部加载内容的特性,所以可以使用其来伪造Ajax请求。
请输入要加载的地址:加载页面位置: window.onload= function(){ Date(); document.getElementById( myDate.getTime(); }; function LoadPage(){ ).value; document.getElementById( targetUrl; }
原理是这样的,设置一个提交按钮,再设置一个输入框,当我们输入一个网址的时候,在当前的页面加载输入网址的页面信息,呈现在iframe框里,这样就能做到不刷新URL来提交不同的信息。
原生ajaxAjax的核心是XMLHttpRequest对象(XHR)。XHR为向服务器发送请求和解析服务器响应提供了接口。能够以异步方式从服务器获取新数据。
一、XMLHttpRequest对象
Ajax的核心是XMLHttpRequest对象(XHR)。XHR为向服务器发送请求和解析服务器响应提供了接口。能够以异步方式从服务器获取新数据。
XHR的主要方法有:
1. void open(String method,String url,Boolen async)
用于创建请求
参数:
method: 请求方式(字符串类型),如:POST、GET、DELETE...
url: 要请求的地址(字符串类型)
async: 是否异步(布尔类型)
2. void send(String body)
用于发送请求
参数:
body: 要发送的数据(字符串类型)
3. void setRequestHeader(String header,String value)
用于设置请求头
参数:
header: 请求头的key(字符串类型)
vlaue: 请求头的value(字符串类型)
4. String getAllResponseHeaders()
获取所有响应头
返回值:
响应头数据(字符串类型)
5. String getResponseHeader(String header)
获取响应头中指定header的值
参数:
header: 响应头的key(字符串类型)
返回值:
响应头中指定的header对应的值
6. void abort()
终止请求
XHR的主要属性有:
1. Number readyState
状态值(整数),可以确定请求/响应过程的当前活动阶段
2. Function onreadystatechange
当readyState的值改变时自动触发执行其对应的函数(回调函数)
3. String responseText
作为响应主体被返回的文本(字符串类型)
4. XmlDocument responseXML
服务器返回的数据(Xml对象)
5. Number states
状态码(整数),如:200、404...
6. String statesText
状态文本(字符串),如:OK、NotFound...
二、get请求
GET用于向服务器查询某些信息:
XMLHttpRequest - Ajax请求 GetXHR(){ ; if(XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr ); } return xhr; } function XmlGetRequest(){ GetXHR(); (){ ){ xhr.responseText; console.log(data); } }; ); // 发送请求 xhr.send(); }
get三、post请求
POST请求用于向服务器发送应该被保存的数据。POST请求的主体可以包含非常多的数据,而且格式不限。
POSTXMLHttpRequest - Ajax请求 GetXHR(){ ; if(XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr ); } return xhr; } function XmlPostRequest(){ GetXHR(); (){ ){ xhr.responseText; console.log(data); } }; ); ); ); }
post jquery ajaxjQuery 提供多个与 AJAX 有关的方法。
通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。
注:2.+版本不再支持IE9以下的浏览器