如何在 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); }