爱站程序员基地1.AJAX 简介
AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
2.AJAX 是什么？
AJAX = Asynchronous JavaScript and XML.
AJAX 是一种用于创建快速动态网页的技术。
AJAX 通过在后台与服务器进行少量数据交换，使网页实现异步更新。这意味着可以在不重载整个页面的情况下，对网页的某些部分进行更新。
传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个页面。
3.AJAX 如何工作
AJAX 基于因特网标准
AJAX 基于因特网标准，并使用以下技术组合：
XMLHttpRequest 对象（与服务器异步交互数据）
JavaScript/DOM（显示/取回信息）
CSS（设置数据的样式）
XML（常用作数据传输的格式）
lamp AJAX 应用程序与浏览器和平台无关的！
AJAX 被用于创建交互性更强的应用程序。
实例：
页面代码：
通过 JavaScript 调用的服务器页面是名为 “DOM2.php” 的 PHP 文件。
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>2</title><script type=\"text/javascript\">window.onload=function(){var btn = document.querySelector(\'#btn\');var namep = document.querySelector(\'#p\');var nameValue= document.getElementById(\'name\').value;var passwordValue = document.querySelector(\'#password\').value;//btn添加点击事件btn.onclick = function() {//创建一个XMLHttpRequest异步对象var xmlHttp = new XMLHttpRequest();//设置请求方式和请求地址xmlHttp.open(\'GET\',\'DOM2.php?username=\'+nameValue+\'&userpassword=\'+passwordValue,true)// 用send发送请求xmlHttp.send(null);// 监听状态变化xmlHttp.onreadystatechange = function() {if(xmlHttp.readyState == 4 && xmlHttp.status == 200){//接收返回的数据console.log(xmlHttp.responseText);if(xmlHttp.responseText == 1){//页面p标签中显示namep.innerText = \'成功\';}}}}}</script></head><body><form><label>姓名:</label><input type=\"text\" name=\"username\" id=\"name\" value=\"\"/><br><label>密码:</label><input type=\"password\" name=\"userpassword\" id=\"password\" value=\"\" /><br><input type=\"button\" value=\"提交\" id=\"btn\"/><br></form><p id=\"p\"></p></body></html>
对应PHP文件代码：
<?php$username = $_GET[\"username\"];$userpassword = $_GET[\"userpassword\"];if($username == \'admin\' && $userpassword == \'123\' ){echo \"1\";}else{echo \"2\" ;}?>
get和post请求的区别?
（1）post更安全（不会作为url的一部分，不会被缓存、保存在服务器日志、以及浏览器浏览记录中）
（2）post发送的数据更大（get有url长度限制）
（3）post能发送更多的数据类型（get只能发送ASCII字符）
（4）post比get慢
（5）post用于修改和写入数据，get一般用于搜索排序和筛选之类的操作（淘宝，支付宝的搜索查询都是get提交），目的是资源的获取，读取数据
.html文件中代码区别
//get方式
//创建一个XMLHttpRequest异步对象var xmlHttp = new XMLHttpRequest();//设置请求方式和请求地址xmlHttp.open(\'GET\',\'DOM2.php?username=\'+nameValue+\'&userpassword=\'+passwordValue,true)// 用send发送请求xmlHttp.send(null);// 监听状态变化xmlHttp.onreadystatechange = function() {if(xmlHttp.readyState == 4 && xmlHttp.status == 200){//接收返回的数据console.log(xmlHttp.responseText);if(xmlHttp.responseText == 1){namep.innerText = \'成功\';}}}}
//post方式
var userBean = \"userName=\" + unValue +\"&userPassword=\"+ pdValue//创建JSON对象var xmlHttp = new XMLHttpRequest();//准备发送请求xmlHttp.open(\'POST\',\'DOM5(xmlphp).php\',true);//设置请求头xmlHttp.setRequestHeader(\'content-type\',\'application/x-www-form-urlencoded\');//发送请求xmlHttp.send(userBean);//事件监听xmlHttp.onreadystatechange = function() {if(xmlHttp.readyState==4 && xmlHttp.status==200){if(xmlHttp.responseBody== 1){hh.innerHTML = \"成功\";}else{hh.innerHTML = \"失败\";}}}
对应PHP文件代码：
//get方式
$username = $_GET[\"username\"];$userpassword = $_GET[\"userpassword\"];
//post方式
$username = $_POST[\"username\"];$userpassword =$_POST[\"userpassword\"];
