面试题：ajax可以接收哪些信息？
答：浏览器可以接收的信息ajax都可以接收例如 字符串，html标签 css样式内容 xml内容 json内容等等，ajax接收返回的信息，需要结合readyState/onreadstatechange/responseText
ajax对象可以访问成员
属性：
responseText:以字符串的形式接收服务器端返回的信息
方法：
open()创建新的http协议（请求方式与地址）
send发送请求
例1 ajax_02.php
<?php
//给客户端返回信息：html标签 css样式 字符串
echo "<div style='color:red'>Today is very good day</div>";
?>
ajax_request_03.html代码：
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>simple document</title>
<meta charset="UTF-8">
<script type="text/javascript">
function f1(){
//建立Ajax对象
var xhr=new XMLHttpRequest();
//创建一个新的http请求，并设置请求的一个服务器端的地址,
//对象.open(请求方式get/post方式,url地址);
xhr.onreadystatechange=function(){
//获得readyState状态变化信息
console.log(xhr.readyState);
}
xhr.open('GET','./ajax_02.php');
//发送http请求
xhr.send(null);
//要随时感知ajax的变化
/*onreadystatechange是ajax的一个事件，在readyState状态发生变化的时候被触发，
为了感知最多的状态信息，要设置在对象创建完毕之后*/
if(xhr.readyState==4){
console.log(xhr.responseText);
}
}
</script>
<style type="text/css"></style>
</head>
<body>
<h2>ajax对服务器发起请求</h2>
<input type="button" value="触发" onclick="f1()"/>
</body>
</html>
例2 显示html代码
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>simple document</title>
<meta charset="UTF-8">
<script type="text/javascript">
function f1(){
//建立Ajax对象
var xhr=new XMLHttpRequest();
//创建一个新的http请求，并设置请求的一个服务器端的地址,
//对象.open(请求方式get/post方式,url地址);
xhr.onreadystatechange=function(){
//获得readyState状态变化信息
//console.log(xhr.readyState);
//要随时感知ajax的变化
/*onreadystatechange是ajax的一个事件，在readyState状态发生变化的时候被触发，
为了感知最多的状态信息，要设置在对象创建完毕之后*/
if(xhr.readyState==4){
console.log(xhr.responseText);
}
}
xhr.open('GET','./ajax_02.php');
//发送http请求
xhr.send(null);
}
</script>
<style type="text/css"></style>
</head>
<body>
<h2>ajax对服务器发起请求</h2>
<input type="button" value="触发" onclick="f1()"/>
</body>
</html>
例3 在页面上显示ajax返回数据代码
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>simple document</title>
<meta charset="UTF-8">
<script type="text/javascript">
function f1(){
//建立Ajax对象
var xhr=new XMLHttpRequest();
//创建一个新的http请求，并设置请求的一个服务器端的地址,
//对象.open(请求方式get/post方式,url地址);
xhr.onreadystatechange=function(){
//获得readyState状态变化信息
//console.log(xhr.readyState);
//要随时感知ajax的变化
/*onreadystatechange是ajax的一个事件，在readyState状态发生变化的时候被触发，
为了感知最多的状态信息，要设置在对象创建完毕之后*/
if(xhr.readyState==4){
console.log(xhr.responseText);
document.getElementById('result').innerHTML=xhr.responseText;
}
}
xhr.open('GET','./ajax_02.php');
//发送http请求
xhr.send(null);
}
</script>
<style type="text/css"></style>
</head>
<body>
<h2>ajax对服务器发起请求</h2>
<input type="button" value="触发" onclick="f1()"/>
<div id="result"></div>
</body>
</html>
如图所示：
