0

I need to generate 185 lines of html on a web page when the user clicks on a button and I want to declare the html code as a multiple lines on a variable but I 've problems with the html code on a variable, I tried several ways researching on the web but I couldn't achieve it.

For example:

 <script type="javascript">

    //it doesn't work
    var html = " <li> <!-- 185 lines of html -->  </li>";

 </script>

Using Heredoc (I thought heredoc notation doesn't work on Javascript -???-) notation seems that works but the javascript contained on the html shows an error.

I really appreciate any help.

MadDev
  • 113
  • 16
  • 1
    You refer to multiple lines and heredoc, but your code example shows neither. – j08691 Jan 13 '16 at 18:34
  • Are you actually outputting the variable anywhere? – patricksweeney Jan 13 '16 at 18:34
  • I can't use the variable because the IDE (PHPStorm BTW) shows errors, I'm trying concatenating strings and it works in fact, but I think that is a really dirty way. – MadDev Jan 13 '16 at 18:45
  • If you're building HTML, it may be more efficient (at least easier to read) to build the elements programmatically. [Here](http://stackoverflow.com/a/8735339/1195056) is an answer I favorited and always refer back to. – krillgar Jan 13 '16 at 18:52

1 Answers1

0

You can do something like this:

 document.getElementById('button').onclick = function(){

      var eleContainer = document.getElementById('container'), //The parent of the of the elements
          html = '',    //Will be filled with html lines
          repeats = 128; //You can change it as much as you want

      for(var i=0; i<repeats; i++){
          html += '<li></li>';
      }

      eleContainer.innerHTML = html;

 }
Marox Tn
  • 142
  • 9
  • I 've a similar code... my problem is that I don't want to concatenate 185 lines on the 'html' variable (using your code as example ;) ) using quotes and + ... I think that is a dirty way... I want (if exist) a way as heredoc notation. – MadDev Jan 13 '16 at 18:48
  • As I read from other forums The heredoc notation does not exist on JavaScript – Marox Tn Jan 13 '16 at 18:50
  • Figuring out how to structure `html` seems to be the problem. BTW your code just sticks an empty `
  • ` tag on the end of `html`, it doesn't wrap it in one. When they later want to add an arbitrary number of new lines of HTML or change the content, they're supposed to count the exact # of lines and edit JS? ... Something to consider.
  • – mc01 Jan 13 '16 at 18:51
  • You may find this useful http://stackoverflow.com/a/14416259/4146647 – Marox Tn Jan 13 '16 at 18:52
  • You mean something like this ? https://jsfiddle.net/s1kpjcbg/1/ – Marox Tn Jan 13 '16 at 18:55