如何存储HTML片段并稍后将其插入文档？

Question

有没有办法使用Javascript或jQuery将HTML代码段存储在变量中？ （显然这是一个非工作的例子）

var mysnippet = << EOF
<div class="myclass">
  <div class="anotherclass">
    Some dummy text
  </div>
</div>
EOF

然后使用jQuery将其插入到文档中：

mysnippet.append($('#someelement'));

修改

请在回答评论之前阅读此内容：我的内容是我的JS文件中的原始HTML代码 ，我需要将其存储在Javascript变量中类似于EOF结构的东西。我需要避免将它放在引号之间。

如果使用Javascript和/或jQuery是不可能的，那么这个问题没有解决方案。

Answer 1

只需通过var content = $('#somediv').html();获取所需div的HTML代码，然后将其附加到某个div中！ $('#otherdiv').append(content);

$().html();提供该div的HTML内容。文档：http://api.jquery.com/html/

$().append(<content>);将内容附加到特殊div。 documentatoin：http://api.jquery.com/append/

Answer 2

您可以使用 ejs ， haml-coffee 等javascript模板，...

Answer 3

是。 Fiddle example

的JavaScript

var html = '<b>Bold</b>'
$('.anotherclass').append(html);

HTML

<div class="myclass">
  <div class="anotherclass">
    Some dummy text
  </div>
</div>

Answer 4

你可以写：

var mysnippet = "<div class='myclass'>"+
  "<div class='anotherclass'>"+
    "Some dummy text"+
  "</div>"+
"</div>";

然后插入使用append函数（以摘录作为参数）。

Answer 5

遗憾的是，<< EOF之类的内容并不存在。这是一个解决方案：

$el = $('<div />')
  .addClass('myClass')
  .append(
    $('<div />')
      .addClass('anotherclass')
      .text('Foo Bar')
  );

Answer 6

在同一问题上思考我发现了这个讨论。我想到的是放一个隐藏的textarea，包含html，然后从那里检索html。

因此，对于加倍的DOM ID，不会发生冲突，因为textarea内容不会呈现为html。

Answer 7

对于那些偶然遇到这个问题的人......  您可能希望使用新的 <template> HTML5中的标记。 遗憾的是，它仍然不会在JavaScript中存储HTML :(