javascript - 如何将 json 文件转换为 HTML 而无需先将它们添加到元素中？

Question

在 jQuery 的网站上有一个文档说，

$.getJSON( "ajax/test.json", function( data ) {
  var items = [];
  $.each( data, function( key, val ) {
    items.push( "<li id='" + key + "'>" + val + "</li>" );
  });

  $( "<ul/>", {
    "class": "my-new-list",
    html: items.join( "" )
  }).appendTo( "body" );
});

用过这种方法的人都知道，它将所有json属性添加到名为“iteams”的变量中，然后通过将字符串添加到一个名为“的类的新无序列表中，将“items”转换为html我的新列表”。

现在，假设我不想添加一个名为“my-new-list”的新无序列表，而是想将新变量转换为字符串并添加到现有的 HTML 元素中，比如使用名为“窗帘”的类(class)，我该怎么做？

这是我的尝试:

var items = [];
var first = '<div class="panel"><div class="panel-gallery"><img src="',
    second = '" Alt=""></div></div>';
$.each( data, function( url ) {
    items.push( first + url + second );
    html: items.join( "" ).appendTo( ".curtain" );
});

显然这会给我一个错误:

html: items.join( "" ).appendTo( ".curtain" );

Answer 1

它给你一个错误，因为它不是一个有效的语法，因为你把它放在一个函数中，而不是一个散列中。如果 items.join 返回 html，只需删除“html:”并执行以下操作:

$(items.join( "" )).appendTo( ".curtain" );

会成功的。