How do I create an HTML template that I can copy dynamically?

Wha开发者_如何学Ct's the correct way to do the (pseudo) following:

<div id="myTemplate">
  <div id="child1"></div>
  <span id="child2"></span>
</div>


<script>
  var templateCopy = document.getElementById("myTemplate")
  var copy1 = document.createElementFromTemplate(templateCopy);
  document.appendChild(copy1);
</script>

TIA

var copy1 = templateCopy.cloneNode(true), beware - id will be copied too.

I know you can do it in jQuery http://api.jquery.com/clone/

Microsoft has contributed a jQuery by having jQuery Templates plugin. Hope this helps

https://github.com/jquery/jquery-tmpl

jQuery templates do pretty much what you are asking. You can use

  $("elem").tmpl(output)

... And also have string substitutions too.