如何使用JavaScript遍历JSON数据?

Mohamad Farhan:

如何遍历JSON数据?如果我尝试这样做,我的代码只会得到1个数据,而不是全部。

这是我的代码:

$.getJSON('profil.json', function(data) {
    let skills = data.skills.graphicdesigner

    $.each(skills, function(i, data) {
       $('#designimg').append('<div class="col-4 pb-3"><img id="myImg" src="img/thumbs/'+ 
       data.image[i] +'" alt="Snow" style="width:100%;max-width:300px"><div id="myModal" 
       class="modal"><span class="close">&times;</span><img class="modal-content" id="img01"><div 
       id="caption"></div></div></div>');
    });
 });

这是我的JSON:

skills":{
  "graphicdesigner": [
    {
        "label": "CorelDraw & Adobe Illustrator",
        "image": ["rimba.jpg","programmer.png","gallery1.jpg"]

    }
]
亚历山大·索维(AlexandreSauvé):

您还需要为每个图像进行另一个循环。

  • 首先,循环graphicdesigner数组。
  • 然后,从第一个循环的项目中循环播放图像。
$.getJSON('profil.json', function(data) {
    let skills = data.skills.graphicdesigner

    $.each(skills, function(i, data) {
        $.each(data.image, function(y, image) {
            $('#designimg').append('<div class="col-4 pb-3"><img id="myImg" src="img/thumbs/'+ 
            image + '" alt="Snow" style="width:100%;max-width:300px"><div id="myModal" ' +
            'class="modal"><span class="close">&times;</span><img class="modal-content" ' +
            'id="img01"><div id="caption"></div></div></div>');
        })
    });
});

它未经测试,但应该是这样。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章