1

Does javascript have a method for having html on multiple lines without appending \ to the end of every line:

alert('\
<a>hello</a>\
<div>world</div>\
');

This is really irritating and escaping all the single quotations is even more irritating.

PHP offers

$variable = <<<XYZ
<html>
<body>

</body>
</html>
XYZ;

Normally I would just keep the html in a separate file and use jquery .load() to get it. But this project im working on is going to be offline and in a single file so thats a no go.

6
  • 1
    No it does not. You could use the DOM API to create the nodes though (if possible). Commented Nov 7, 2011 at 1:26
  • @Felix: if anything, building html up node-by-node is even MORE irritating than having to escape multi-line strings. Commented Nov 7, 2011 at 1:28
  • Basically, I am making a user script that embeds a new javascript element with the innerHTML as the javascript source so that I can offer features that have callbacks/events. Commented Nov 7, 2011 at 1:28
  • You could still use jQuery offline to load in a file from the local filesystem. As long as you're loading the page initially from the local file system, you can load another from it too using the file:// URL syntax Commented Nov 7, 2011 at 1:28
  • Nope; no HERE strings in JavaScript. Either concatenation, DOM, or slashes. Or templates, which is just text inside invisible DOM elements/files/etc. Commented Nov 7, 2011 at 1:29

3 Answers 3

2

I would recommend just putting the HTML into a hidden div:

<div id="my_html" style="display:none;">
  <a>hello</a>
  <div>world</div>
</div>

Then on page load set the variable:

var my_html = "";
$(function() {
  my_html = $('#my_html').html();
});

above code assumes you're using jQuery.

Sign up to request clarification or add additional context in comments.

13 Comments

-1 for storing data (which happens to be a HTML string) as HTML in HTML. HTML should only contain information you wish to display.
His string is HTML... which means it will be displayed, dumb dumb.
You misunderstood. Your storing information that your not rendering. Your exactly storing a string in HTML that is to be unpacked by JavaScript. It just happens to be the case that the string your storing is a HTML string and your storage mechanism is as a HTML node which is hidden. I'm basically ew, what an ugly hack. Besides you also failed to notice he doesn't have control over the HTML and he is not using jQuery
The string does indeed happen to be HTML... which makes it work fine. Obviously if it were another sort of data it would be a bad idea, but it's not another sort of data, IT IS HTML. IT WILL BE RENDERED. In most situations one would just make that element become visible, but my guess is he needs to add the element multiple times, thus the need to have it in a variable. The use of jQuery is totally beside the point. My answer is perfectly valid, and you are a perfect tard tard.
@TomDignan the main problem is having a having the HTML in the JavaScript in the first place. All this is is a dirty hack to accommodate that.
|
0

The answer is "No", as per the comments above.

But a workaround I've used from time to time is to create the HTML (or other string or data that is easier to create without JS escaping) in a temporary file where I can format it as required while I work on it with nice indenting, extra blank lines for grouping or whatever, and then use a find-and-replace to escape any quotes and do something about the linebreaks (your choice of inserting \ at the end of each line, wrapping each line with "..." +, or just removing all linebreaks) such that the resulting string is safe to copy and paste directly into my JavaScript source code. Once it's in the JS source I would then abandon the temporary file and do any further edits directly in the JS, though obviously you could save the file if you're willing to do the find-and-replace and copy-paste every time something changes.

(Actually you don't need the temporary file at all if you don't care about keeping the non-JSified text, because most editors that you're likely to use for coding will have a find-and-replace that works on a selection.)

1 Comment

Hmm...an uncommented downvote even though I gave the correct answer ("No") and offered a workaround that was different to the other answer's so that Drake would have several ideas to choose from. Nice.
-1

You could still have it in a separate file as you used to do and have a compile step to create just one file.

You could load the file using RequireJS and the text! plugin, and use r.js to compile the js/text/html files to one js file. After that, you can include the js content into the html itself...

1 Comment

Thanks for downvoting without telling why. That is really helpful for the community...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.