javascript - jQuery JSON 嵌套循环

Question

我有以下脚本:

function drawDimensions(divid) {
    $.getJSON('dimensions.json', function(data) {
        $.each(data, function(index) {
            var ppp = $('#' + divid).append("<div class='dTitle'><img src='images/cleardot.gif' />" + index + "</div><br>");
          $.each(this, function(k, v) {
              $('<div>').append(v).appendTo(ppp);
          });
        });
    });
}
drawDimensions('dim');

我正在尝试嵌套 div，以便第一个循环中的值将成为第二个循环中 div 的父级。

我做错了什么？第二个循环 div 没有嵌套在第一个循环中，而是简单地附加在第一个循环之后。

Answer 1

一个明显的错误(可能不是唯一的)是 ppp 仍将引用父 div，而不是您在那里创建的 div。

像在内部循环中那样使用 appendTo()，或者将赋值分开，例如:

function drawDimensions(divid) {
    var $container = $('#' + divid);
    $.getJSON('dimensions.json', function(data) {
        $.each(data, function(index) {
          var ppp = $("<div class='dTitle'><img src='images/cleardot.gif' />" + index + "</div><br>");
          $container.append(ppp); // or ppp.appendTo($container);
          $.each(this, function(k, v) {
              $('<div>').append(v).appendTo(ppp);
          });
        });
    });
}
drawDimensions('dim');

尝试看看效果如何，并在评论中告诉我。

关于示例代码的注释:

• 我缓存了容器 div jQuery 对象，因为反正只有一个
• 另外，使用 $ 作为我使用的变量的前缀。只是 jQuery 对象的常见做法，不是必需的。