皆さんは、Javascriptで変数に複数行の文章またはHTML文を代入する際にどのような記述をしていますか?
単純にコピペをするだけで、簡単に代入できたしか無いかと考え調べてみました。
1.一般的なな手法 「+」で結合
var listCode = '<ul id="menu"> ' + ' <li>ホーム</li> ' + ' <li>製品案内</li> ' + ' <li>会社概要</li> ' + ' <li>お問合せ</li> ' + '</ul> ';
行の末尾に「+」をつけます。文章はシングルクォーテーションで囲み、複数の行を結合するイメージになります。この方法が一般的でよく使われます。
2.マイナーですが、こんな方法もあります。
var listCode = '<ul id="menu"> \ <li>ホーム</li> \ <li>製品案内</li> \ <li>会社概要</li> \ <li>お問合せ</li> \ </ul>';
行の末尾に半角「¥」マーク(バックスラッシュも同じ意味)をつけます。
シングルクォーテーションは、全体に囲むだけでいいので、少しだけ手間が省けます。
しかしこの方法はGoogleのガイドラインでは、禁止されています。日常的に使うのはやめておいたほうが良いと思います。
3.非推奨であるが複数行をコピペすることで貼り付けられる方法
var listCode = (function() {/* <ul id="menu"> <li>ホーム</li> <li>製品案内</li> <li>会社概要</li> <li>お問合せ</li> </ul> */}).toString().match(/\/\*([^]*)\*\//)[1];
コメントの中に文字列を記述します。Windowsのsafariなどで不具合があるようですが、また、この記述はコメントの本来の使用方法ではありませんので、できるだけ使わない方が良さそうです。
単純にHTMLのコードなどをペーストするだけで使用することができるので、とっても手軽です。
ローカルでの実験やテストなどチョットした制作(公開するデータではないもの)などの時に使用すると簡単で便利かもしれません。
結論
基本的には1.の一般的な手法を使用するのをおすすめします。
デモなどの簡単に実装するためには3のコピペでサックっと実装するのがおすすめです。