javascript - 使用 Javascript 创建 HTML...从页面复制或存储在变量中？

Question

所以我正在创建一个按钮来添加新的 <div>到一组<div>标签。这是一个相当复杂的<div>有很多配置选项，最终大约有 30-40 行代码。

我的问题基本上是我应该存储股票的 HTML <div>作为 Javascript 变量或将其隐藏在 DOM 中并引用 <div>通过 jQuery 并将内容设置为变量。我的页面中会有很多此类代码，因此我担心使用 Javascript 生成大量 HTML

var item_html = 
    '<div>'+
      .... 30-40 lines of code .....
    '</div>';
$('new_item').on('click',function(){
  $('#Container').append(item_html);
});

或者

$('new_item').on('click',function(){
  $('#Container').append($('#new_item_html').html());
});

Answer 1

使用 HTML5 模板元素。我相信这就是引入它的确切原因:https://developer.mozilla.org/en/docs/Web/HTML/Element/template