优点：减轻服务器的负担,按需取数据,最大程度的减少冗余请求
局部刷新页面,减少用户心理和实际的等待时间,带来更好的用户体验
基于xml标准化,并被广泛支持,不需安装插件等
进一步促进页面和数据的分离
缺点：AJAX大量的使用了javascript和ajax引擎,这些取决于浏览器的支持.在编写的时候考虑对浏览器的兼容性.
AJAX只是局部刷新,所以页面的后退按钮是没有用的.
对流媒体还有移动设备的支持不是太好等

实例化ajax


  //实例化对象

var xmlhttp=null;

if(window.XMLHttpRequest)

{

   xmlhttp=new XMLHttpRequest();

}else{

   xmlhttp=ActiveXObject("Mircrosoft.XMLHTTP");    //浏览器是否支持 XMLHttpRequest 对象

}

//向服务器发送请求

xmlhttp.open("请求的类型get或post","文件在的服务器上位置","true异步或false同步");
xmlhttp.send();//将请求发送到 服务器上

setRequestHeader("头名称","规定头的值");

//服务器响应
responseText(); //获取字符串形式的响应数序
responseXML(); //获取XML形式的响应数据

onreadystatechange事件
//当请求发送到服务器的时候，我们需要执行

XMLHttpRequest的三个重要属性
onreadystatechange 存储函数，每当readyState属性改变时，就会调用该函数
readystate  XMLHttpRequest的状态
0为请求未初始化
1服务器连接已建立
2 请求已接收
3 请求处理中
4 请求已完成,且响应已就绪

status 200 “OK”  404 未找到页面

xmlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

    }

  }

　

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>Examples</title>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

</head>

<body>

    <form  entype="multipart/form-data" name="aax">

    	<table border="0" width="300">

    		<tr>

    			<td>名称</td>

    			<td><input type="text" name=name /></td>

    		</tr>

    		<tr>

    			<td>类型</td>

    			<td>

    			<select name="s">

    				<option value="1">服装</option>

    				<option value="2">视频</option>

    				<option value="3">汽车</option>

    			</select>

    			</td>

    		</tr>

    		<tr>

					<td align="right">单价：</td>

					<td><input type="text" name="price"/></td>

				</tr>

				<tr>

					<td align="right">库存：</td>

					<td><input type="text" name="total"/></td>

				</tr>

				<tr>

					<td align="right">图片：</td>

					<td><input type="file" name="pic"/></td>

				</tr>

				<tr>

					<td align="right" valign="top">描述：</td>

					<td><textarea rows="5" cols="20" name="note"></textarea></td>

				</tr>

				<tr>

					<td colspan="2" align="center">

						<input type="submit" onclick="ajax();"  value="添加"/>   

						<input type="reset" value="重置"/>

					</td>

				</tr>

    	</table>

    </form>

    <script>

function ajax()
{
var f=document.aax;
var name=f.name.value;
var typeid=f.s.value;
var pic=f.pic.value;
var price=f.price.value;
var note=f.note.value;

var xmlhttp=null;
if(window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}else{

xmlhttp=ActiveXObject("Microsoft.XMLHTTP");
}
var lian="name="+name+"&typeid="+typeid+"&pic="+pic+"&price="+price+"&note="+note;
$xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
xmlhttp.open("get","addcas.php",true);
xmlhttp.send(null);
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{

document.getElementById("sed").innerHTML=$xmlhttp.responeseText;
}
};

}

    </script>

</body>

</html>

　　

PHP和ajax详解的更多相关文章

  1. $.ajax()方法所有参数详解;$.get(),$.post(),$.getJSON(),$.ajax()详解

    [一]$.ajax()所有参数详解 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注 ...

  2. Ajax详解及使用Ajax时的返回值类型有哪些？

    Ajax详解 Ajax = 异步 JavaScript 和 XML. Ajax 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以在 ...

  3. $.ajax()详解

    $.ajax()方法详解   jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Str ...

  4. jQuery中$.ajax()详解(转)

    JQuery中$.ajax()方法参数详解     url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get) ...

  5. Ajax详解

    一:什么是Ajax AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法 ...

  6. AJAX 详解注释很全来自互联网

    1: //用户名校验的方法 2: //这个方法使用XMLHTTPRequest对象进行AJAX的异步数据交互 3: var xmlhttp; 4: function verify(){ 5: //1. ...

  7. jquery ajax详解

    详细参数列表url:发送请求的连接地址type:请求方式 get:获取 post:发送 put和deletetimeout:设置请求超时时间async:默认true为异步请求,false同步请求锁住浏 ...

  8. Validform使用ajax详解

    demo.config({    showAllError:true,    url:"这里指定提交地址",    ajaxpost:{        //可以传入$.ajax() ...

  9. 原生态AJAX详解和jquery对AJAX的封装

    AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript    JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...

  10. Ajax详解及其案例分析------如何获得Ajax对象，使用Ajax对象发送GET和POST请求，校验用户名，POST和GET请求时的乱码处理，实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

随机推荐

  1. Jquery判断离开页面时，通过Ajax更新数据（兼容IE,Chrome，FF浏览器）

    现在很多项目都有客户离开网页时,处理一些业务的需求.所以焦点就聚集在了如何获取页面离开事件. 以下是本人在一个项目中需要记录页面浏览时长的处理办法,测试兼容IE,Chrome,FF浏览器 代码如下: ...

  2. linux:主机规划和磁盘分割

    1>.在linux系统中,每个装置都被装成一个档案来对待: 2>.各硬体装置在linux当中的档案名:SATA介面的硬碟的档案名为/dev/sd[a-d];在linux中,几乎所以的硬体装 ...

  3. [翻译] java NIO 教程－－－介绍

    原文地址:http://tutorials.jenkov.com/java-nio/index.html Java NIO(new IO)是从java1.4之后的对IO API的另一种选择,即对标准j ...

  4. G面经prepare: Straight Partition of A Deck of Cards

    Define “Straight” as 5 cards with consecutive numbers. Determine if the deck can be fully divided in ...

  5. PHP isset()与empty()的使用区别详解

    通过对PHP语言的学习,应该知道它是基于函数的一款HTML脚本语言.庞大的函数库支持着PHP语言功能的实现.下面我们为大家介绍有关PHP函数isset()与empty()的相关用法.   PHP的is ...

  6. SpringMvc项目分析

    首先在配置文件中配置一个视图解析器,视图解析器规定了视图解析的规则,即controller处理请求之后,返回给DispatcheServlet一个字符串(也可能是ModelAndView之类的),而D ...

  7. HDU 4899 Hero meet devil（状压DP）（2014 Multi-University Training Contest 4）

    Problem Description There is an old country and the king fell in love with a devil. The devil always ...

  8. ZOJ 3645 BiliBili（高斯消元）

    Shirai Kuroko is a Senior One student. Almost everyone in Academy City have super powers, and Kuroko ...

  9. CCSprite的使用方法大全

    一.精灵创建及初始化 1.从图片文件创建: CCSprite *sprite = [CCSprite spriteWithFile:@"ImageFileName.png"]; 默 ...

  10. 夺命雷公狗---DEDECMS----27dedecms电影的下载地址的完成

    我们现在要完成的是电影的下载地址这里: 我们的下载地址都是放在我们的dede_addonmovie(附加表)里面去才可以的,因为下载地址的个数是不能确定的,所以我们就将所有的下载地址存放到一个字段里面 ...