XMLHttpRequest

最新推荐文章于 2024-05-05 07:41:03 发布

Sword_A

最新推荐文章于 2024-05-05 07:41:03 发布

阅读量217

点赞数

文章标签： xmlhttprequest html button xml xhtml div

本文链接：https://blog.csdn.net/yuluo727282752/article/details/6827427

版权

<!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>ajax异步交互</title>
<script type="text/javascript" src="jquery-1.6.js"></script>
<script type="text/javascript" src="proving.js"></script>
</head>
<body>
<input id="username1" type="button" value="HTML" οnclick="proving(1)" />
<input id="username2" type="button" value="XML" οnclick="proving(2)" />
<!--与服务器数据交互后，动态显示结果，div或span预留空间-->
<div id="result"></div>
<!--javascript脚本的获取办法  document.getElementBy("ID")Id;
jquery脚本获取办法  $("$ID");
-->
</body>
</html>

XMLHttpRequest 应用，改变页面刷新效果

//创建XMLHttpRequest对象
//声明体局变量

//a获取username

function proving(name){
	
var xmlhttp;
var username = document.getElementById("username"+name).value;

if(window.XMLHttpRequest){
    xmlhttp = new XMLHttpRequest();  //使用新的浏览器
   //针对firefox的一个bug
   if(xmlhttp.overrideMimeType){
xmlhttp.overrideMimeType("text/xml");
   }
}else if(window.ActiveXObject){
   //IE5.0  5.5  6.0
	     //旧版浏览器
   var activename = ['MSXML2.XMLHTTP','Microsoft.XMLHTTP'];
   
   for(var i=0;i<activename.length;i++){
	   try{
	   xmlhttp = new ActiveXObject(activename[i]);
	   break;
	   }
	   catch(e){
		     //判断出现异常后
	    }
   	}
}

//第二步：指定响应的处理函数
xmlhttp.onreadystatechange=callback;
function callback(){
	//接收服务器端(demo.php)返回来的xml数据动动态写入div预留空间
	//接收信息前提条件是
	//第一个条件HTTP 请求 的状态度为“HTP”
	if(xmlhttp.readyState == 4){
	if(xmlhttp.status == 200){
	var responseText = xmlhttp.responseText;
	//动态写入DIV的预留空间
	//获取div元素节点
	var divNode = document.getElementById("result");
	//写入文本信息
	divNode.innerHTML = responseText;
	}
	}
}

//第三步：发送HTTP请求
//open  send  
//open(method,url,async)
//method:get\post\head          
//async 是否异步 true\false
xmlhttp.open('GET','demo.php?name='+username,true);   //传输数据
xmlhttp.send(null);
}

使用PHP输出：

<?php
$_name = $_GET['name'];  //获取客户端用户信息

//判断用户是否存在
if($_name == "XML"){
	echo "这是一个XML";
}else  if($_name == "HTML"){
	echo "这是一个HTML";
}
?>

Sword_A

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
XMLHttpRequest

ajax异步交互XMLHttpRequest 应用，改变页
复制链接

扫一扫