This week only. Pastebin PRO Accounts Christmas Special! Don't miss out!Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Aug 19th, 2013  |  syntax: None  |  size: 2.02 KB  |  views: 27  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  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>
clone this paste RAW Paste Data