php100视频之Ajax+PHP快速上手及应用（一）【第48讲】-优快云博客

本文介绍了如何使用Ajax技术实现网页元素的动态加载。通过创建XMLHttpRequest对象，设置HTTP请求方式和URL，监听请求状态变化，并在请求成功后更新页面内容。示例代码包括index.php作为入口文件，ajax.js包含JavaScript逻辑，for.php处理服务器端请求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近做网站，要用到这个知识，所以到php100的网站上去看了这个视频，现在把总结写在这里：

1、核心内容是js技术

2、原理结构图：

3、 XMLHttpRequest对象相关方法：XMLHttpRequest.open(); XMLHttpRequest.onreadystatechange; 获取执行结果XMLHttpRequest.responseText

以下为一个完整的例子：

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="ajax.js"></script>
</head>

<body>
<a href="#" onclick="funphp100('o')">o</a>
<a href="#" onclick="funphp100('t')">t</a>
<a href="#" onclick="funphp100('x')">x</a>

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

ajax.js

// JavaScript Document
var xmlHttp;
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;
		document.getElementById('php100').innerHTML = byphp100;
	}

for.php

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

最后结果如下：

例子下载：http://download.youkuaiyun.com/detail/comeontom/4427572