用ajax jquery 显示html_instructions？答案

【问题标题】：showing html_instructions with ajax jquery?用ajax jquery 显示html_instructions？
【发布时间】：2016-05-08 13:51:46
【问题描述】：

从此链接 https://maps.googleapis.com/maps/api/directions/json?origin=Jalan+Kaliurang&destination=Jalan+Malioboro，通过 ajax 请求加载，我如何才能仅提取和显示 html 说明

这里是html代码

<!DOCTYPE html>
<html>
    <head>
        <title>Coba Ajax JQuery</title>
        <script type="text/javascript" src="jquery-1.12.3.js"></script>
        <script type="text/javascript" src="jquery.xdomainajax.js"></script>
        <script type="text/javascript" language="javascript">
            $(document).ready(function() {
                $('#driver').click(function(event) {
                    $.ajax({
                        cache: false,
                        url: "https://maps.googleapis.com/maps/api/directions/json?origin=Jalan+Kaliurang&destination=Jalan+Malioboro",
                        type: "GET",
                        success: function(data) {
                            var string_data = JSON.stringify(data);
                            $('#stage').html(string_data);
                        },
                        error: function() {
                        alert("error");
                        }
                    });
                });
            });
        </script>
    </head>
    <body>
        <input type="button" id="driver" value="Load Data" />
        <div id="stage">STAGE</div>
    </body>
</html>

【问题讨论】：

不清楚你在问什么。那一串文本在哪里——在页面上？所以你问如何从 DOM 中获取一些文本？
@Utkanos 看起来上述链接实际上是具有 html_instructions 属性的 JSON 响应
@b.enoit.be JSON对象中似乎还有多个html_instructions属性
@BlazeSahlzen 表示只有 OP 可以回复，逻辑希望所有这些都显示
看起来你想加载一个 JSON。您可以使用getJSON 将数据直接加载到对象中，然后通过data.html_instructions 访问它

标签： jquery json ajax

【解决方案1】：

您需要使用 JSON.parse 而不是 JSON.stringify。您从 AJAX 调用获得的响应已经是 JSON。你需要解析它。

var data_obj=JSON.parse(data);

这个 data_obj 会有点复杂，因为它会创建元素数组。因此，为了访问 html_instructions，您需要使用正确的数组索引运行循环。如果你能告诉我你想使用的确切 html_instructions，我可以给你访问它的代码。

如果您想自己解决。只需 console.log(data_obj) 并查看结构并相应地编写循环。

【讨论】：