如何在我的网页上显示来自JSON的数据?
问题描述:
我在写一个发送ajax请求的脚本。云似乎回应了JSON,但是我怎样才能在我的网页上显示来自JSON的数据?如何在我的网页上显示来自JSON的数据?
Here漂亮打印的JSON的链接。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<button onclick="myFunctionPost()">Start</button>
<script>
function myFunctionPost() {
jQuery.ajax({
url: 'https://iotmmss0018275632trial.hanatrial.ondemand.com/com.sap.iotservices.mms/v1/api/http/app.svc/T_IOT_77877E443B666B7FED2F?$format=json',
type: 'POST',
crossDomain: true,
dataType: 'jsonp',
success: function(response) {
console.log(response);
},
error : function(error) {
console.log(error);
}
});
}
</script>
</body>
</html>
答
要达到此目的,您可以使用JSON.stringify()
空格参数。您还需要用<pre> </pre>
包装输出将保留行间距。
function myFunctionPost() {
$.ajax({
url: 'https://jsonplaceholder.typicode.com/posts',
type: 'GET',
success: function(response) {
$('#pp').html('<pre>' + JSON.stringify(response, undefined, 4) + '</pre>');
},
error: function(error) {
console.log(error);
}
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<button onclick="myFunctionPost()">Start</button>
<p id="pp"></p>
</body>
</html>
来源:Does jQuery have a JSON/javascript object to HTML pretty print function similar to PHP's var_dump?
答
通过var responseObject = json.parse(response)
做一个JavaScript对象。
然后像JS对象一样做? 很难告诉确切的代码,而不知道你想要显示什么,用什么HTML。
的回应将deserialised一个对象,所以你只需要访问的属性,以填补任何你需要的HTML结构。我们无法提供任何具体的帮助,因为您的问题太广泛,而且您没有展示您想要创建的HTML,但是我建议您将目标打破到任务并使用Google搜索,即。 '我如何在jQuery中创建元素?','我如何循环访问数组'?等等。jQuery文档也可以帮助你:http://api.jquery.com。如果您仍然遇到*特定*问题,请提出另一个问题,提供您想要实现的全部细节 –
,这取决于您的要求。如果数据以字符串形式出现,然后将其解析为json对象,并且您可以获取json中的所有数据 –