Javascript Can Do Multiline Strings??
Posted on 01/27/2009 @ 02:31AMThis one was a shocker to me. While reading this post on jQuery animation, I followed the link to Karl Swedberg's jQuery example. Whilst looking at the source, I saw a bit of code that made me stop and stare:
$.extend($.facebox, {
settings: {
opacity : 0,
overlay : true,
loadingImage : '/facebox/loading.gif',
closeImage : '/facebox/closelabel.gif',
imageTypes : [ 'png', 'jpg', 'jpeg', 'gif' ],
faceboxHtml : '\
<div id="facebox" style="display:none;"> \
<div class="popup"> \
<table> \
<tbody> \
<tr> \
<td class="tl"/><td class="b"/><td class="tr"/> \
</tr> \
<tr> \
<td class="b"/> \
<td class="body"> \
<div class="content"> \
</div> \
<div class="footer"> \
<a href="#" class="close"> \
<img src="/facebox/closelabel.gif" title="close" class="close_image" /> \
</a> \
</div> \
</td> \
<td class="b"/> \
</tr> \
<tr> \
<td class="bl"/><td class="b"/><td class="br"/> \
</tr> \
</tbody> \
</table> \
</div> \
</div>'
},
Holy crap! A multiline string in JS? Is it even possible?
I thought it might have something to do with the fact that he had an HTML 5 doctype at the top of the page. So I googled a bit, and as it turns out, it's actually documented. And moreover, some testing revealed that it works in all major browsers, including IE 6.
This is a pretty cool discovery. It means that we now have an alternate way of setting a block of content into a Javascript variable. It's not perfectly pretty, but it's less bloated than rendering it in the html, and way neater than string concatenation.