代码之家 › 专栏 › 技术社区 › da_root

以HTML格式显示json中的所有数据

html javascript

-3

da_root · 技术社区 · 7 年前

大家好我有一个Json数据如下:

{"city_name": "A",
        "members": [
            {
                "members_name": "Jonathan Doe",
                "bod": "1980-01-20",
                "job": "Accounting",
            },
            {
                "members_name": "Lucy Dash",
                "bod": "1976-01-20",
                "job": "HR",
            },
]
    }

以及javascript调用:

var res = info.city_name.filter(function(item){
  return item.city_name =='City A';
});
console.log(res);
var HTML = '<span>'+res[0].city_name+'</span>';
$('#name').append(HTML)
HTML = '<span>'+res[0].members_name+'</span>';
$('#members').append(HTML);

我上面的js调用仍然使用行号值在html中打印,我想做的是在一个调用中显示所有成员的名称“类似于 res[一]。members\u名称 但它不起作用。

谢谢你的帮助

2 回复 | 直到 7 年前

Ingadi 7 年前

var res = info.city_name.filter(function(item){
  return item.city_name =='City A';
});    

//add this
res[0].members_names = res[0].members.reduce( (acc, curr) => {
    acc += ` ${curr.members_name} `
    return acc;
}, '');

//Then you can use res[0].members_names to display all the members names

您需要迭代成员数组以显示所有成员。也许添加一个新的属性members\u names,该属性是所有成员名称的串联,并显示该名称将对您有效。

Asone 7 年前

res.forEach(function(r){
    var HTML = '<span>'+r.city_name+'</span>';
    HTML += '<span>'+r.members_name+'</span>';
    $('#members').append(HTML); 
});

或

for(i=0;i<res.length;i++){
    var HTML = '<span>'+res[i].city_name+'</span>';
    HTML += '<span>'+res[i].members_name+'</span>';
    $('#members').append(HTML); 
}

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前