如何在我的网页上显示来自 JSON 的数据？

Question

我正在编写一个发送 ajax 请求的脚本。 Cloud 似乎以 JSON 响应，但如何在我的网页上显示来自 JSON 的数据？

Here link 印刷精美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>

Answer 1

通过var responseObject = json.parse(response)制作一个javascript对象。

然后像对待JS对象那样做？在不知道你想显示什么的情况下很难说出确切的代码，HTML.

Answer 2

要实现这一点，您可以使用 JSON.stringify() space 参数。您还需要用 <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?

如何在我的网页上显示来自 JSON 的数据？

How can I display the data from the JSON on my webpage?

javascript

jquery

json

ajax

pretty-print