JavaScript HERE-doc or other large-quoting mechanism?

javascript quotes heredoc
Evan Carroll picture Evan Carroll · Jun 2, 2010 · Viewed 12.2k times · Source

Is there a convenient way to quote a large block of HTML that has both single and double quotes in JavaScript?

Is there anything like a HERE-doc <<EOF, a multi-quote character """, or custom delimiters q{}?

Any creative or inventive solutions to this problem?

Answer

Pointy picture Pointy · Jun 2, 2010

Some people don't like this, so be prepared for scorn and derision, but one trick is to dump your "big block of stuff" into a <script language="text"> block:

<script id='blockOfStuff' language="text">
  Hi this is random stuff
  <h1>Including HTML markup</h1>
  And quotes too, or as one man said, "These are quotes, but
  'these' are quotes too."
</script>

John Resig has used that technique (or that abomination, if you prefer) for examples of his templating mechanism.

You can get at the contents with "innerText" or "innerHTML" as appropriate, or through the services of your favorite framework.

edit — note that via jQuery (contrary to what I said in a comment below) .text() does not work, though I think it should. Use .html() instead.

Related questions

Escape quotes in JavaScript

I'm outputting values from a database (it isn't really open to public entry, but it is open to entry by a user at the company -- meaning, I'm not worried about XSS). I'm trying to output a tag like this: &…

Read More
Escaping Strings in JavaScript

Does JavaScript have a built-in function like PHP's addslashes (or addcslashes) function to add backslashes to characters that need escaping in a string? For example, this: This is a demo string with 'single-quotes' and "double-quotes". ...would become: This is a …

Read More
Difference between single quotes and double quotes in Javascript

I know that in PHP, the only difference between double quotes and single quotes is the interpretation of variable inside a string and the treatment of escape characters. In JavaScript, I often see double quotes used in strings. Is there …

Read More