如何在 Z0ECD11C1D7A287401D148A23BBD7A2 数组中的 object 中获取 JSON object

Question

我有聊天的 JSON 转储文件。 我需要将其提取出来并打印到网站上。 我是初学者，所以请帮助我。

我有我松弛工作区的 JSON 转储文件。 我想从中提取一些关键细节。 我想要在用户配置文件 object 内部的 real_name，它在 JSON 的数组内部。 如何提取它。 另外，我如何提取所有 real_name 值（我的意思是有嵌套对象）。请帮我解决这个问题。

[
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "hey there",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    },
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "welcome",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    },
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "Help me",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    }
]

请帮助我如何将这些值输入 HTML 以及使用 JAVASCRIPT 和 ajax 可能吗？

Answer 1

只需遍历 JSON 类似的东西。 （注意 null 值）

var obj = [
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "hey there",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    },
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "welcome",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    },
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "Help me",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    }
];


for (var i in obj)
{
     var type = obj[i].type;
     var source_team = obj[i].source_team;

     var user_profile = obj[i].user_profile;

     var real_name = user_profile.real_name;


    alert(source_team+" : "+real_name);

}

Answer 2

如果我理解正确，您想提取真实姓名列表。 正如你所说，你正在使用 JavaScript。 将数组分配给变量让我们说 arr;

    var arr = [
    {
        "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "hey there",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    },......,
    "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58",
        "type": "message",
        "text": "Help me",
        "source_team": "TN4AF0V5W",
        "team": "TN4AF0V5W",
        "user_profile": {
            "real_name": "marvelmohinish99",
            "team": "TN4AF0V5W"
        }
    }];

var list_real_name = arr.map((userObj)=>{
  return userObj['user_profile']['real_name'];
})

Answer 3

如果您在文件（本地）或远程有 json，

以下脚本将起作用

     <script>
            function fetchJSONFile(path, callback) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.onreadystatechange = function() {
            if (httpRequest.readyState === 4) {
                if (httpRequest.status === 200) {
                    var data = JSON.parse(httpRequest.responseText);
                    if (callback) callback(data);
                }
            }
        };
        httpRequest.open('GET', path);
        httpRequest.send(); 
    }

    // this requests the file and executes a callback with the parsed result once
    //   it is available. You can give URL just in case you are provided with URL.

fetchJSONFile('test.json', function(data){
        // do something with your data
        console.log(data[0].user_profile.real_name);
    });
        </script>

使用 Ajax

<script>
    $(document).ready(function(){
        $.ajax({
    url: 'test.json',
    type: "GET",
    dataType: 'json',
    success: function (data) {
        $.each(data,function(i,data)
        {
          console.log(data.user_profile.real_name);//This will loop 
      //through the result
        });
        console.log(data[0].user_profile.real_name); //Show only first //result
        }

     });
     });

</script>

不要忘记在 ajax 代码之前添加Jquery

Answer 4

 var obj = [{ "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58", "type": "message", "text": "hey there", "source_team": "TN4AF0V5W", "team": "TN4AF0V5W", "user_profile": { "real_name": "marvelmohinish99", "team": "TN4AF0V5W" } }, { "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58", "type": "message", "text": "welcome", "source_team": "TN4AF0V5W", "team": "TN4AF0V5W", "user_profile": { "real_name": "marvelmohinish99", "team": "TN4AF0V5W" } }, { "client_msg_id": "3a223f8d-b5aa-4c9c-9b63-045ec6f90b58", "type": "message", "text": "Help me", "source_team": "TN4AF0V5W", "team": "TN4AF0V5W", "user_profile": { "real_name": "marvelmohinish99", "team": "TN4AF0V5W" } } ]; for (var i = 0; i < obj.length; i++) { console.log("Real name" + i + ": " + obj[i].user_profile.real_name); }