Question

我一直使用$ .get来获取灯箱的内容

$.get('sidebar-lightbox.html', function(data, elem) {

//DO STUFF HERE
 });

我正在寻找一种简洁的方法来添加大的（ish），也许是20行HTML。正在做的那一刻

 $('.selector').append('<div id="wrapper"><div id="inner"><div id="content"></div></div></div>')

随着html越来越大，这有点混乱，难以理解，寻找一种不错的方式：）。

Answer 1

$('<div/>', { id: 'wrapper' }).appendTo('.selector');
$('<div/>', { id: 'inner' }).appendTo('#wrapper');
$('<div/>', { id: 'content' }).appendTo('#inner');

如果您愿意，您也可以做类似的事情：

$('<div/>', { id: 'wrapper' }).append(
    $('<div/>', { id: 'inner' }).append(
        $('<div/>', { id: 'content' })
     )
).appendTo('.selector');

您可以在此处设置任意数量的属性，请记住将JavaScript关键字放在字符串中，即$('<div/>', { id: 'id', 'class': 'x' })。您还可以链接多个.attr和.html来调用以获得所需的标记。

Answer 2

首先创建一个var然后追加它。它会更具可读性

var stuff = '<div id="wrapper">';
    stuff += '<div id="inner">';

// etc. then you append it
$('.selector').append(stuff);

jquery追加大量的html

2 个答案: