优点：减轻服务器的负担,按需取数据,最大程度的减少冗余请求
局部刷新页面,减少用户心理和实际的等待时间,带来更好的用户体验
基于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. Java基础之写文件——将素数写入文件中（PrimesToFile）

    控制台程序,计算素数.创建文件路径.写文件. import static java.lang.Math.ceil; import static java.lang.Math.sqrt; import ...

  2. linux：档案与档案系统的压缩、打包与备份

    压缩比:压缩后与压缩的档案锁占用的磁碟空间大小,就称之为压缩比 压缩技术: a.将没有使用到的空间丢出去,以让档案资料占用的空间变小 b.将重复的资料统计记录(比如100个1,不是真正的用100个元位 ...

  3. 【转】Tomcat总体结构（Tomcat源代码阅读系列之二）

    本文是Tomcat源代码阅读系列的第二篇文章,我们在本系列的第一篇文章:在IntelliJ IDEA 和 Eclipse运行tomcat 7源代码一文中介绍了如何在intelliJ IDEA 和 Ec ...

  4. WebService之Axis2(5)：会话（Session）管理

    WebService给人最直观的感觉就是由一个个方法组成,并在客户端通过SOAP协议调用这些方法.这些方法可能有返回值,也可能没有返回值.虽然这样可以完成一些工具,但这些被调用的方法是孤立的,当一个方 ...

  5. Leetcode: Count Numbers with Unique Digits

    Given a non-negative integer n, count all numbers with unique digits, x, where 0 ≤ x < 10n. Examp ...

  6. Lintcode: Wood Cut

    Given n pieces of wood with length L[i] (integer array). Cut them into small pieces to guarantee you ...

  7. 树形DP（Holiday's Accommodation HDU4118）

    题意:有n间房子,之间有n-1条道路连接,每个房间里住着一个人,这n个人都想到其他房间居住,并且每个房间不能有两个人,问所有人的路径之和最大是多少? 分析:对于每条边来说,经过改边的人由该边两端元素个 ...

  8. linux第4天 shell socket

    $[ ] 表示形式告诉shell对方括号中的表达式求值 echo $[3+9] 赋值运算符 =,+=,-=,*=,/=,%=,&=,^=.|=,<<=,>>= let ...

  9. JSon_零基础_005_将po（bean）对象转换为JSon格式的对象字符串，返回给界面

    将po(bean)对象转换为JSon格式的对象字符串,返回给界面 导入jar包: 编写po(bean)类: package com.west.webcourse.po; /** * 第01步:编写be ...

  10. 为archlinux配置cron

    cron的作用:cron可以用来周期性地自动执行一些命令. cron的实现:cron有很多实现版本,例如:cronie, dcron, fcron, bcron, vixie-cron,我安装的是 c ...