JSON.stringify(data) 将data 转换为json格式
如果data 是 数组格式 则转换之后为[1,12,3]
如果data是 一个类 则转换之后为 {“name”:”hxyt”}
app.all('/json-server',(request,response)=>{
response.setHeader('Access-Control-Allow-Origin','*');
// 接受所有请求的头信息
response.setHeader('Access-Control-Allow-headers','*');
const data ={
name:'hxyt'
};
const data2=[1,12,3];
let str2=JSON.stringify(data2);
let str =JSON.stringify(data);
// 设置响应
response.send(str+str2);
});<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<textarea id="textarea">
</textarea>
</body>
</html>
<script>
window.onclick=function()
{ const textarea=document.getElementById("textarea");
const xhr=new XMLHttpRequest();
xhr.open('POST','http://127.0.0.1:8000/json-server');
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.status===4){
if(xhr.status>200&&xhr.status<300){
console.log(xhr.status);
}
}
textarea.innerHTML=xhr.response;
console.log(xhr.response);
}
}
</script>执行结果
要把json格式转换为数据原来的格式，有两种方法
1.手动转换
let data=JSON.parse(xhr.response);
textarea.innerHTML=data.name;<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<textarea id="textarea">
</textarea>
</body>
</html>
<script>
window.onclick=function()
{ const textarea=document.getElementById("textarea");
const xhr=new XMLHttpRequest();
xhr.open('POST','http://127.0.0.1:8000/json-server');
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.readyState===4){
if(xhr.status >= 200 && xhr.status<=300){
let data=JSON.parse(xhr.response);
textarea.innerHTML=data.name;
}
}
}
}
</script>
2.自动转换
// 自动转换，设置响应体数据的类型
xhr.responseType=’json’;
//自动转换
textarea.innerHTML=xhr.response.name;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<textarea id="textarea">
</textarea>
</body>
</html>
<script>
window.onclick=function()
{ const textarea=document.getElementById("textarea");
const xhr=new XMLHttpRequest();
// 自动转换，拿到响应值之后会自动转为json格式
xhr.responseType='json';
xhr.open('POST','http://127.0.0.1:8000/json-server');
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.readyState===4){
if(xhr.status >= 200 && xhr.status<=300){
// 手动转换
// let data=JSON.parse(xhr.response);
// textarea.innerHTML=data.name;
//自动转换
textarea.innerHTML=xhr.response.name;
}
}
}
}
</script>
https://gitee.com/rjgc1192/ajax/commit/5e3302cfcc388d30ac696950fbc4128fba8c8a83
版本5e3302cf
版权声明：本文为sharesb原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。