How can I concatenate multiline string in javascript?

javascript multiline string concatenation
multi line string variable javascript
javascript multiline string support
javascript multiline string with variables
javascript continue string on next line
js text multiple lines
string more than one line javascript
typescript multiline string

There are lots of results for the correct syntax for appending <li>'s, however I am trying to find a solution where +this['name']+ values are included in the <li>'s. firebug is displaying 'SyntaxError: unterminated string literal' and jslint is displaying 'Unclosed string'. I've tried many different variations of the placements of the commas but I haven't been able to get it to work.

 $.each(data.result, function() {
     $("ul").append("<li>Name: "+this['name']+"</li>
                     <li>Age: "+this['age']+"</li>
                     <li>Company: "+this['company']+"</li>
                     <br />");
 });

Thank you.

you can escape end of line with backslash character \, like so:

 $.each(data.result, function(){
 $("ul").append("<li>Name: " + this['name'] + "</li> \
     <li>Age: " + this['age'] + "</li> \
     <li>Company: "+this['company']+"</li> \
     <br />");
 });

This is due to the fact that Javascript automatically insert semi-columns sometime on line end. And in this case, you string weren't close. Another solution is to close each string on each line, and using + to concat them all.

 $.each(data.result, function(){
 $("ul").append("<li>Name: " + this['name'] + "</li>" +
     "<li>Age: " + this['age'] + "</li>" +
     "<li>Company: "+this['company']+"</li>" +
     "<br />");
 });

(Unrelated, but you <br/> aren't allowed inside a <ul> element)

How can I concatenate multiline string in javascript?, you can escape end of line with backslash character \ , like so: $.each(data.result, function(){ $("ul").append("<li>Name: " + this['name'] + "</li>  To concatenate multiple string variables, use the JavaScript concatenation operator.

This should be much faster

 li = '';
 $.each(data.result, function(){
     li += "<li>Name: " + this['name'] + "</li>" +
          "<li>Age: " + this['age'] + "</li>" +
          "<li>Company: "+this['company']+"</li>" +
          "<br />"; // could remove this and use css
 });

 $("ul").append(li);

See http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/

Creating multiline strings in JavaScript, Google's JavaScript style guide recommends to use string concatenation instead of escaping newlines: Do not do this: var myString = 'A rather long string of  Programmatically Concatenate the Lines Into One Line. Another way to deal with multi-line strings in JavaScript is to append each following line to the previous one, making one virtual long line by concatenating the three lines. It's done by ending the line with the + operator to append the string on the next line.

You actually don't want to concatenate this at all! Consider for a moment what will happen to variable data that contains HTML or HTML-like data. Using your method, it will be parsed as such, possibly breaking things and even opening you up to XSS attack methods.

You're already using jQuery, so the proper way is easy:

$('ul').append(
    $('<li/>').text('Name: ' + this.name), 
    $('<li/>').text('Age: ' + this.age),
    // etc.
);

(Note: I believe .append() allows as many parameters as you give it. If not, try using an array of elements as you append.)

Multi-Line JavaScript Strings, Multi-line JavaScript strings can be created by adding a backslash at the end of The JavaScript language performs automatic semicolon insertion at the end It's advantages are that it's faster than concatenation and more  The concat() method is used to join two or more strings. This method does not change the existing strings, but returns a new string containing the text of the joined strings.

How to Create Multiline Strings in JavaScript, You can use string concatenation (through + operator) to create a multi-line string . The following example will show you how to compose some HTML content  Using normal strings, you would have to use the following syntax in order to get multi-line strings: console.log('string text line 1 ' + 'string text line 2'); // "string text line 1 // string text line 2"

Multiline strings in ES6 JavaScript, This means that instead of concatenating together a list of strings with tons of extra + operators and newlines you can insert data directly into a  Any new line characters inserted in the source are part of the template literal. Using normal strings, you would have to use the following syntax in order to get multi-line strings: console.log('string text line 1 \ string text line 2'); // "string text line 1 // string text line 2" To get the same effect with multi-line strings, you can now

How to Create Multi-Line String with Template Literals in JavaScript, easy to produce multi-line strings. Previously, we had to use the \n or separate string concatenation which was messy and difficult to read… The JavaScript language performs automatic semicolon insertion at the end lines, so creating multiline strings usually ends up looking something like this: var multiStr = "This is the first line" + "This is the second line" + "This is more"; String upon string of concatenated JavaScript messugly, slow, andugly.

Comments
  • Definitely go with the second solution proposed here
  • @Ian Yep, second solution is the one we see the most. Although, first solution work as well: davidwalsh.name/multiline-javascript-strings
  • You're right that the first solution works too, I'm not sure how well supported it is. I saw a question like this that had this same problem and I know someone proposed using `` but it wasn't compatible everywhere (or something like that). Might as well go with the safe way
  • I think the second solution is slower