Question

在jQuery中创建HTML结构的最佳方法是什么？这是我尝试过的两个例子，但我正在寻找最快/最好的渲染方法。

jQuery数组结构示例

var struct = [
  '<div class="daBox-outer">',
    '<div class="daBox-inner">',
      '<div class="daBox-top" />',
      '<div class="daBox-bottom" />',
    '</div>',
    '<div class="daBox-overlay" />',
  '</div>'].join('');

$("body").append(struct);

jQuery Direct附加示例

$("body").append(//->
  '<div class="daBox-outer">' +
    '<div class="daBox-inner">' +
      '<div class="daBox-top" />' +
      '<div class="daBox-bottom" />' +
    '</div>' +
    '<div class="daBox-overlay" />' +
  '</div>'
//<-
);

我正在努力学习，但找不到合适的例子！

Answer 1

$("body").append(//->
  '<div class="daBox-outer">' +
    '<div class="daBox-inner">' +
      '<div class="daBox-top" />' +
      '<div class="daBox-bottom" />' +
    '</div>' +
    '<div class="daBox-overlay" />' +
  '</div>'
//<-
);

你也可以使用“JSON”来包装HTML字符串，但我真的没有理由在这里使用JSON。

var jsonData = {
  html: '<div class="daBox-outer">...</div>'
};
$(document.body).append(jsonData.html);

创建嵌套的HTML结构

1 个答案: