JavaScript で一重引用符と二重引用符の両方を含む HTML の大きなブロックを引用する便利な方法はありますか?
HERE-doc <<EOF
、マルチクォート文字"""
、またはカスタム区切り文字のようなものはありq{}
ますか?
この問題に対する創造的または独創的な解決策はありますか?
JavaScript で一重引用符と二重引用符の両方を含む HTML の大きなブロックを引用する便利な方法はありますか?
HERE-doc <<EOF
、マルチクォート文字"""
、またはカスタム区切り文字のようなものはありq{}
ますか?
この問題に対する創造的または独創的な解決策はありますか?
一部の人々はこれを好まないので、軽蔑と嘲笑の準備をしてください。ただし、1 つのトリックは、「大きな塊」をブロックにダンプすること<script language="text">
です。
<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 は、彼のテンプレート メカニズムの例として、その手法 (または、必要に応じてその忌まわしきもの) を使用しています。
必要に応じて「innerText」または「innerHTML」を使用するか、お気に入りのフレームワークのサービスを介してコンテンツにアクセスできます。
編集— jQuery経由(以下のコメントで私が言ったことに反して).text()
は機能しないことに注意してください。.html()
代わりに使用してください。
ネイティブではサポートされていません。
しかし、私たちはそれを機能させる方法を話しているので、これが(私の経験では)そうするものです:
<script type="text/javascript">
var name = "Mud";
var str = "\
My name is " + name + "\
not to be confused with Bill\
or Jack or Pete or Dennis\
my name is " + name + " and it's always been\
";
alert("Les'n one: " + str);
</script>
それらのバックスラッシュでうまくいきます。ブロック全体が引用符で囲まれているため、文字列内の二重引用符は必ずバックスラッシュでエスケープしてください。
これは改行を保持しないことに注意してください。各行の末尾にスラッシュを付ける前に、手動で「\n」として挿入する必要があります。一方、各行の先頭にある空白のインデントは出力に含まれます。
実際、これは、スクリプト(XMLなど)で長い複数行の文字列を宣言する必要がある場合に最適に機能しますが、その文字列を定義したとおりにフォーマットしておく必要がある場合はあまり効果的ではありません。
乾杯
JavaScript ではできませんが、JavaScript 上の薄いレイヤーであるCoffeeScriptではできます。
リンクをたどって、「Multiline Strings and Heredocs」までスクロールします。
少し前に、関数内で複数行のコメントを使用する巧妙なソリューションを見たのを覚えています。
(function () {
/*
"This is an example of a multi-line string. It's really just a mult-line
comment, and it's wrapped in quote marks. You might also notice the
apostrophe's ;-)";
*/
});
注: 最後のアポストロフィは意図的に間違っています ;-P
秘訣は、関数のtoString()
メソッドを呼び出し、正規表現を使用して複数行のコメントを解析することです。賢いが、Pointy の提案によく似ており、少し忌まわしい。
私は実際に、質問が本番環境での使用に真剣に実行可能な方法を探しているとは思いませんでした.結論に飛びついた私自身の責任です.関連する文字列リテラル区切り文字をエスケープしない理由がよくわかりません. 以下のコメントで Tim Down が指摘したように、ECMAScript 第 3 版では関数の toString() が実装に依存するものとして定義されています。
念のため、ブラウザーの互換性を確認することにしました。この方法は IE、Opera、Safari、および Chrome で実行できますが、返される文字列にコメントが含まれない Firefox では実行できません。 http://jsfiddle.net/2yvXG/
現在標準となっている ECMAscript 6 では、バックティック (アクセント グレイブ) を使用して複数行のリテラル文字列を引用できます。残念ながら、これは IE 11 ではサポートされていないため、ほとんどの Web サイトでは使用しないでください。(クレジット: Adam Katz、上)
例:
var str=
`Line 1
Line 2`;
JavaScript 用ヒアドキュメント
FuncToHereDoc ("デリミタ"、コメント付きの HEREDOC で呼び出されない関数)
function FuncToHereDoc(here,str) {
var reobj = new RegExp("/\\*"+here+"\\n[\\s\\S]*?\\n"+here+"\\*/", "m");
str = reobj.exec(str).toString();
str = str.replace(new RegExp("/\\*"+here+"\\n",'m'),'').toString();
return str.replace(new RegExp("\\n"+here+"\\*/",'m'),'').toString();
}
使用法:
FuncToHereDoc("HERE", MyHereDoc);
function MyHereDoc(){
/*HERE
<p>
This is written ing the HEREDOC, notice the multilines :D.
</p>
<p>
HERE
</p>
<p>
And Here
</p>
HERE*/
}
以前の回答とさまざまなユースケースに基づいて、小さな例を次に示します。
https://gist.github.com/lavoiesl/5880516
/*!
* Extract a function's comment, useful to have multiline string
* @link https://gist.github.com/lavoiesl/5880516
*
* Don't forget to use /*! to avoid the comment being removed in minification
*/
function extractFuncCommentString(func) {
var matches = func.toString().match(/function\s*\(\)\s*\{\s*\/\*\!?\s*([\s\S]+?)\s*\*\/\s*\}/);
if (!matches) return false;
return matches[1];
}
var myString = extractFuncCommentString(function(){/*!
<p>
foo bar
</p>
*/});
これがあなたの答えです。ページの本文でスパンまたはdivを作成します。一意のIDを使用して、必要なすべてのテキストを必要なすべての引用符とともにページに配置するかどうかは関係ありません。スパンまたはdivのスタイルを「display:none;visibility:hidden;」にします。次に、必要に応じてIDからDOMオブジェクトを取得し、innerHTMLを取得して目的の処理を行います。