本文介绍了异步交互及AJAX技术的基本概念、功能和应用案例，包括同步与异步交互的区别、如何利用jQuery简化编程过程以及PHP操作XML与JavaScript操作XML的实现方式。以登录案例为例，详细阐述了通过AJAX实现用户验证的过程。
同步：用户(在URL地址栏输入页面请求http://www.baidu.com)---
服务器接收信息(函数或者新方法等待接收信息)---客户端继续向下执行-----
(如果服务器处理请求结束，结果返回到新方法)---浏览器只处理所需的数据
(不涉及整个页面的刷新)
功能
1）改善表单验证方式，不需要打开新的页面，也不需要进行整个页面的提交；
2）不需要刷新，减少了客户的等待时间；
3）按需要获取数据信息；
4）读取外部的数据，进行整合；
5）异步交互
登录的案例
1）服务器端文件demo.php
功能：验证用户名称的合法性
2）前台页面index.html
功能：显示输入用户名的区域
jquery是一个Javascript库，简化编程过程
ajax的一个框架
使用：<script type=”text/javascript” src=”文件”></script>
get:将信息通过URL地址栏进行传递
post:将信息通过HTTP方式进行传递
第二种方式实现AJAX
Php操作xml
Php内置DOMDocument
$_doc = new DOMDocument(); //DOM对象
$_doc->getElementsByTagName() //nodelist对象 item length
Javascript操作
XML domdocument
Var a = new activexobject; //dom节点对象
a. getelementbyid()
实例：
同步：
index.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>同步交互</title>
</head>
<body>
<p>检查用户名称是否存在：</p>
<form action=”demo.php” method=”get”>
用户名：<input type=”text” name=”name”>
<input type=”submit” value=”提交”>
</form>
</body>
</html>
demo.php:
<?php
$get=$_GET[‘name’];
if($get==”zhangsan”)
echo “登陆成功”;
else
echo $get.”不存在”;
?>
异步：
index.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>同步交互</title>
<script type=”text/javascript” src=”jquery.js”>
</script>
<script type=”text/javascript” src=”yanzheng.js”>
</script>
</head>
<body>
<p>检查用户名称是否存在：</p>
用户名：<input type=”text” id=”username”>
<input type=”button” value=”提交” onclick=”yanzheng()”>
</body>
</html>
yanzheng.js：
function yanzheng(){
var name=(“#username”);
var username=name.val();
alert(username);
$.get(“demo.php?name=”+username,null,callback)
alert(data);
}
demo.php：
<?php
$get=$_GET[‘name’];
if($get=”zhangsan”)
echo “成功”;
else
echo $get.”不存在”;
?>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
