正在创建嵌套的HTML结构

Creating nested HTML Stucture

本文关键字：HTML 结构 嵌套 创建      更新时间：2024-03-14

在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直接附加示例

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

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

$("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);
相关文章：