Ajax
- XML
- JSON
后端返回前端的数据格式有以下两种：
XML
注：使用xml形式返回前段时，php头部应该添加以下代码：
header(“Content-type: text/xml; charset=utf-8”);
xml部分：
<?xml version="1.0" encoding="UTF-8"?>
<persion>
<name>张三</name>
<age>18</age>
</persion>
php部分：
<?php
header("Content-type: text/xml; charset=utf-8");
echo file_get_contents("04_AJAX_xml.xml");
?>
html部分：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
$("button").click(function(){
$.ajax({
type: "get",
url: "04_ajax_xml.php",
success: function(data) {
// console.log(data);
var name = data.querySelectorAll("name");
var age = data.querySelectorAll("age");
console.log(name[0].innerHTML);
console.log(age[0].innerHTML);
// var $data = data.responseXML;
// console.log(typeof $data);
},
error: function() {
alert("请求失败");
}
})
})
})
</script>
</head>
<body>
<button type="button">获取数据</button>
</body>
</html>
JSON
html部分（此处引用的js是自己跟着视频封装的ajax方法）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/ajax_post_ask.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
window.onload = function() {
var demo = document.getElementById("app");
demo.onclick = function() {
ajax({
type: "get",
url: "03_JSON.php",
success: function(data) {
// console.log(data.responseText);
var str = data.responseText;
// console.log(typeof str);
var obj = JSON.parse(str);
console.log(obj.name);
console.log(obj.age);
},
error: function(msg) {
alert("请求失败");
}
})
}
}
</script>
</head>
<body>
<button type="button" id="app">测试按钮</button>
</body>
</html>
php部分：
<?php
echo file_get_contents("text.txt");
?>
txt文件部分：
{
"name":"zs",
"age":"18"
}
更多推荐
Ajax后端返回前端的数据格式
发布评论