如何利用javascript接收json信息并进行处理
更新时间：2020年08月06日 10:29:33 作者：杜小白Zero
这篇文章主要介绍了如何利用javascript接收json信息并进行处理，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
javascript接收处理json信息
ajax获得接口信息，javascript本身处理json信息；
通过eval（）把接收的json字符串变成真实的对象信息。
提供的json接口数据01.php：
<?php
header("content-type:text/html;charset=utf-8");
//制作一个json信息
echo '{"city":"北京","temp":"9","WD":"西南风"}';
客户端接收处理json信息，要通过eval()把字符串的json变为object的json；
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>javascript接收处理json</title>
<script type="text/javascript">
function getweather(){
//ajax去请求接收json信息
//js做后期处理
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
//alert(typeof xhr.responseText);//string
//把接收的字符串json具体变为object的json对象
eval("var jn_info="+xhr.responseText);
console.log(jn_info);
console.log(jn_info.city);//北京
console.log(jn_info.WD);//西南风
console.log(jn_info.temp);//9
}
}
xhr.open('get','./01.php');
xhr.send(null);
}
//在javascript里边，把字符串“string”变为对象“object”
//var obj = "{name:'kitty',age:5}";
//eval(字符串参数) 字符串参数变为表达式运行
//eval("var cat="+obj); //eval("var cat={name:'kitty',age:5}")
//console.log(cat);
</script>
</head>
<body>
<h2>接收json信息</h2>
<input type="button" value="获得天气" onclick="getweather()">
</body>
</html>
执行效果：
如何把js的字符串变为js的对象：
//在javascript里边，把字符串“string”变为对象“object”
var obj = "{name:'kitty',age:5}";
//eval(字符串参数) 字符串参数变为表达式运行
eval("var cat="+obj); //eval("var cat={name:'kitty',age:5}")
console.log(cat);
到此这篇关于如何利用javascript接收json信息并进行处理的文章就介绍到这了,更多相关javascript接收处理json信息内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
react-router-dom v6 通过outlet实现keepAlive 功能的实现
本文主要介绍了react-router-dom v6 通过outlet实现keepAlive功能，文中根据实例编码详细介绍的十分详尽，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
cookie是网站设计者放置在客户端（浏览器）的小文本文件，cookie不仅能够实现保存密码功能，还可以通过cookie保存最近浏览记录增加用户体验。本文给大家介绍js使用cookie实现记住密码功能及cookie相关函数讲解，感兴趣的朋友一起看看吧2016-11-11
本文给大家分享一段实例代码介绍JS判断时间段的方法，需要的朋友参考下吧2017-06-06
有时候，为了更清楚方便的查看输出信息，我们可能需要将一些调试信息进行分组输出，那么可以使用console.group来对信息进行分组，在组信息输出完成后用console.groupEnd结束分组。2009-07-07
这篇文章主要介绍了JavaScript的Proxy可以做哪些有意思的事儿,Proxy是ES6中提供的新的API，可以用来定义对象各种基本操作的自定义行为 （在文档中被称为traps，我觉得可以理解为一个针对对象各种行为的钩子），,需要的朋友可以参考下2019-06-06
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
原生JS中是有contains方法的，但只有dom元素的包含关系，这里脚本之家就为大家分享一下扩展的字符string与数组arr的扩展代码2020-04-04
这篇文章主要介绍了JS实现判断滚动条滚到页面底部并执行事件的方法,本文先是分析了需求以及必备知识,然后给出实现代码,需要的朋友可以参考下2014-12-12
这篇文章主要为大家详细介绍了Bootstrap创建可折叠组件的对应方法，以实例为大家分享了Bootstrap折叠组件，感兴趣的小伙伴们可以参考一下2016-02-02
这篇文章主要为大家详细介绍了一个网易表单以及及时验证功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
详解JavaScript如何创建一个非自动播放的GIF网络组件
这篇文章主要为大家介绍了如何利用JavaScript创建一个允许您的用户决定是否要播放gif的Web组件，文中的实现步骤讲解详细，需要的可以参考一下2022-02-02
最新评论