Advertisement
Guest User

Untitled

a guest
Aug 19th, 2013
40
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.02 KB | None | 0 0
  1. <div id="foo"></div>
  2. <script type="text/javascript">
  3. var longString = '<div id="lol">
  4. <div id="otherstuff">
  5. test content. maybe some code
  6. </div>
  7. </div>';
  8.  
  9. document.getElementById('foo').innerHTML = longString;
  10. </script>
  11.  
  12. var longString = makeHTML([{
  13. div : {
  14. id : "lol",
  15. children : [{
  16. div : {
  17. id : "otherstuff",
  18. children : [{
  19. text : "test content. maybe some code"
  20. }]
  21. }]
  22. }]
  23.  
  24. makeHTML([{
  25. span : {
  26. onclick : function (event) {/* do something */}
  27. }
  28. }]);
  29.  
  30. function makeElement (tag, spec, children) {
  31. var el = document.createElement(tag);
  32. for (var n in spec) {
  33. if (n == 'style') {
  34. setStyle(el,spec[n]);
  35. }
  36. else {
  37. el[n] = spec[n];
  38. }
  39. }
  40. if (children && children.length) {
  41. for (var i=0; i<children.length; i++) {
  42. el.appendChild(children[i]);
  43. }
  44. }
  45. return el;
  46. }
  47.  
  48. /* implementation of setStyle is
  49. * left as exercise for the reader
  50. */
  51.  
  52. document.getElementById('foo').appendChild(
  53. makeElement(div,{id:"lol"},[
  54. makeElement(div,{id:"otherstuff"},[
  55. makeText("test content. maybe some code")
  56. ])
  57. ])
  58. );
  59.  
  60. /* implementation of makeText is
  61. * left as exercise for the reader
  62. */
  63.  
  64. var lol = document.getElementById("template_lol").clone();
  65. lol.firstChild.innerHTML = "code and stuff";
  66. foo.appendChild(lol);
  67.  
  68. <body>
  69. <div>normal stuff</div>
  70.  
  71. <div style="display:none" id="templateBucket">
  72. <div id="template_lol"><div class="otherstuff"></div></div>
  73. </div>
  74. </body>
  75.  
  76. var longString =
  77. '<div id="lol">' +
  78. '<div id="otherstuff">' +
  79. 'test content. maybe some code' +
  80. '</div>' +
  81. '</div>';
  82.  
  83. <script type="text/x-my-stuff" id="longString">
  84. <div id="lol">
  85. <div id="otherstuff">
  86. test content. maybe some code
  87. </div>
  88. </div>
  89. </script>
  90. <script type="text/javascript">
  91. var longString = document.getElementById("longString").text;
  92. document.getElementById('foo').innerHTML = longString;
  93. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement