ajax+php快速上手和应用

 

1 、 ajax 是什么及其工作原理

 

Ajax 由 HTML 、 JavaScript ™ 技术、 DHTML 和 DOM 组成，这一杰出的

方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。

 

html触发-js-反映执行php文件

 

 

2 、创建 XMLHttpRequest 对象

 

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

个对象的操作

 

首先我们来了解怎么在 javascript 中创建这个对象：

JS代码 ：

xmlHttp = new XMLHttpRequest();

 

这对于规范的 Js 支持的浏览器来讲是没错的

恰恰相反 IE 却就不支持，所以没办法我们只能

做个判断再创建一个 IE 支持的

 

xmlHttp = new ActiveXObject ('Microsoft.XMLHTTP');

 

3 、 XMLHttpRequest 对象相关方法

 

打开请求

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

 

准备就绪执行

 

XMLHttpRequest. onreadystatechange

 

获取执行结果

 

XMLHttpRequest. responseText

写实例由于javascript不熟练，造成type写错都不知道， type="text/javascript"这里写成 type="application/x-javascript"

test-ajax.php文件代码

<script type="text/javascript" src="ajax.js"></script>
<a href="#" οnclick="funphp100('i')">i</a>
<a href="#" οnclick="funphp100('o')">o</a>
<a href="for.php?id=u">u</a>

<div id="php100"></div>

for.php文件代码：

<?php
if($id=$_GET[id]){
 for($i=1;$i<10;$i++){
  echo $id;
  }
  exit();
 }
?>

ajax.js文件代码：

var xmlHttp;
//判断浏览器类型，ie和其他浏览器不同，要用active
function S_xmlhttprequest(){
 if(window.ActiveXObject){
  xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
  }else if(window.XMLHttpRequest){
   xmlHttp = new XMLHttpRequest();
   }
 }
function funphp100(url){
 S_xmlhttprequest();
 xmlHttp.open("GET","for.php?id="+url,true);
 xmlHttp.onreadystatechange = byphp;
 xmlHttp.send(null);
 }
function byphp(){
 var byphp100 = xmlHttp.responseText;
 //这里php100和外面对应
 document.getElementById('php100').innerHTML = byphp100;
 }

总的感觉收获很大！