首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Ajax从json对象()检索值

Ajax从json对象()检索值
EN

Stack Overflow用户
提问于 2015-11-25 02:26:57
回答 2查看 74关注 0票数 1

这是我第一次体验ajax。我已经使用ajax成功地从服务器获得了GET响应。但是,我面临从JSON检索值的问题。

我的ajax调用:

代码语言:javascript
复制
url: "ur",
type: "GET",
cache: false,    
dataType:"json",  
contentType: "application/json",
success: function(res) {                        
    console.log(res);
}

来自服务器的JSON响应:

代码语言:javascript
复制
{
  "message": [
    {
      "files": "SS", 
      "messageBody": "gOOD", 
      "messageID": 1, 
      "messageTitle": "THTH", 
      "photos": "DD", 
      "userID": 2, 
      "videos": "FF"
    }, 
    {
      "files": "", 
      "messageBody": "bla bala blaa", 
      "messageID": 2, 
      "messageTitle": "another", 
      "photos": "", 
      "userID": 3, 
      "videos": ""
    }, 
    {
      "files": "The Cock files", 
      "messageBody": "New message 11 Body", 
      "messageID": 3, 
      "messageTitle": "New message 11 Title", 
      "photos": "The Cock photos", 
      "userID": 3, 
      "videos": "The Cock videos"
    }
  ]
}

我可以在控制台中打印JSON对象。但问题是从JSON检索内容。我尝试过多种方法从JSON对象中检索值。任何帮助都是有价值的。

注意:我是Ajax的新手。请不要标记为副本。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-11-25 02:29:57

代码语言:javascript
复制
var res= {
  "message": [
    {
      "files": "SS", 
      "messageBody": "gOOD", 
      "messageID": 1, 
      "messageTitle": "THTH", 
      "photos": "DD", 
      "userID": 2, 
      "videos": "FF"
    }, 
    {
      "files": "", 
      "messageBody": "bla bala blaa", 
      "messageID": 2, 
      "messageTitle": "another", 
      "photos": "", 
      "userID": 3, 
      "videos": ""
    }, 
    {
      "files": "The Cock files", 
      "messageBody": "New message 11 Body", 
      "messageID": 3, 
      "messageTitle": "New message 11 Title", 
      "photos": "The Cock photos", 
      "userID": 3, 
      "videos": "The Cock videos"
    }
  ]
}




$.each(res.message, function(index,value){
console.log(value.files)
console.log(value.messageBody)
console.log(value.messageID)

$('body').append(value.files +"<br>" + value.messageBody +"<br>" + value.messageID +"<hr>");
})
代码语言:javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

这边试试。

票数 3
EN

Stack Overflow用户

发布于 2015-11-25 02:50:18

这样做吧:

代码语言:javascript
复制
var x = {
  "message": [
    {
      "files": "SS", 
      "messageBody": "gOOD", 
      "messageID": 1, 
      "messageTitle": "THTH", 
      "photos": "DD", 
      "userID": 2, 
      "videos": "FF"
    }, 
    {
      "files": "", 
      "messageBody": "bla bala blaa", 
      "messageID": 2, 
      "messageTitle": "another", 
      "photos": "", 
      "userID": 3, 
      "videos": ""
    }, 
    {
      "files": "The Cock files", 
      "messageBody": "New message 11 Body", 
      "messageID": 3, 
      "messageTitle": "New message 11 Title", 
      "photos": "The Cock photos", 
      "userID": 3, 
      "videos": "The Cock videos"
    }
  ]
};

然后访问数据,在这种情况下,如下所示:

代码语言:javascript
复制
var z = x.message[0].files; // value of z is "SS"

附加阅读:Objects/JSON

更新:在javascript中,可以通过检查数组中的元素长度来获得数组中的元素数,如本例中的x.message.length;

因此,如果您想列出所有数据,可以这样做:

代码语言:javascript
复制
for(var i = 0; i < x.message.length; i++) {
    var tempUl = document.createElement('ul');
    tempDiv.id = "object"+i;

    // now you can do something like this
    var tempLi = document.createElement('li');
    tempLi.innerHTML = x.message[i].files;   // or x.message[i]['files'];
    tempUl.appendChild(tempLi);
    // ... and so one ... 

    // or you can do it like this
    for(var j = 0; j < Object.keys(x.message[i]).length; j++) {
        var tempLi = document.createElement('li');
        var tempVal = Object.keys(x.message[i])[j];

        tempLi.className = tempVal;    // if you need to sort it or access them by any other way... also you can use classList.add();
        tempLi.innerHTML = x.message[i][tempVal];
        tempUl.appendChild(tempLi);
    }
}

...or类似的东西。这应该会产生无序列表。我很想试一试,抱歉。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/33907513

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档