Ajax+PHP快速上手及应用

ajax的工作原理（Asynchronous JavaScript and XML）

Ajax由HTML，JavaScript技术，DHTML和DOM组成，这一杰出的方法可以将笨拙的Web界面转化为交互性的Ajax应用程序。

基本技术有：

HTML用于建立Web表单并确定应用程序其他部分使用的字段。

JavaScript代码是运行Ajax应用程序的核心代码，帮助改进与服务器应用程序的通信。

DHTML或Dynamic HTML，用于动态更新表单。我们将使用div，span和其他动态HTML元素来标记HTML。

文档对象模型DOM用户（通过JavaScript代码）处理HTML结构和（某些情况下）服务器返回的XML。

 

XMLHttpRequest对象

对于Ajax，最核心的一个对象是XMLHttpRequest,所有的Ajax操作都离不开这个对象的操作

首先我们来了解怎么在javascript中创建这个对象：xmlHttp = new XMLHttpRequest();  

但是要注意的是，在IE浏览器中比较特殊，xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');  

 

相关方法

 

打开请求

XMLHttpRequest.open(传递方式，地址，是否异步请求)

 

准备就绪执行

XMLHttpRequest.onreadystatechange

 

获取执行结果

XMLHttpRequest.responseText

 

 

js代码

var xmlHttp; function $_xmlhttprequest(){ if(window.ActiveXObject){ xmlHttp = new ActiveXObject('Microsoft.XMLHttp'); } else if(window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } //数据发送 function funphp100(url) { $_xmlhttprequest(); xmlHttp.open("GET", "for.php?id="+url, true); xmlHttp.onreadysatechange = byphp;//调用方法之间写就可以 xmlHttp.send(null); } //数据刷新 function byphp(){ var byphp100 = xmlHttp.responseText; //DOM技术 document.getElementById('php100').innerHTML = byphp100; } 

 

php代码

<mce:script type="text/javascript" src="ajax.js" mce_src="ajax.js"></mce:script> //这里是脚本触发 <a href="#" mce_href="#" onclick="funphp('o')">o</a> //这里的id要对应 <div id="php100"></div> 

 

 

for.php中只是做了个数据处理，返回一个数据即可

 

 

 

http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html