2

私のプロジェクトでは、Javascript 文字列内に HTML のスニペットがいくつかあります。これらは、有効な JS としてフォーマットする必要があります。たとえば、改行はありません。この 1 行の形式では、HTML を編集するのが面倒になる場合があります (また、エディターには構文の強調表示がありません)。

これらのスニペットを外部ファイルとして保持し、実行時にロードするという考えがありましたが、これにより多くのネットワーク呼び出しが追加されます。理想的な解決策は、いくつかの HTML スニペット ファイルを取り、有効な JS 文字列に解析されたすべての HTML を含む JS ファイルを出力できる何らかの種類のプリプロセッサです。ファイル名はおそらく変数名です。

このようなものは存在しますか？例: 入力:

snippet_a.html

<div>
    My HTML here including whitespace...
</div>

snippet_b.html

<div>
    More HTML here ...
</div>

strings.js ファイルとして出力:

snippet_a = '<div>My HTML here, whitespace as \n ...</div>';  
snippet_b = '<div>More HTML here ...</div>';

トークンを介して特定のファイルにあるはずの場所に文字列を配置できる場合は、さらにクールです。私は、CSS プリプロセッサ、JS コンパイラ、「Persistant Include」に似た Textmate バンドル、ANT スクリプトなどのワークフロー ソリューションを考えています...

テンプレート化は通常の方法ですが、これにより、テンプレートがダンプされた特定の HTML ファイルに JS が関連付けられます。

Textmateの永続的なインクルード機能のようなIMOは素晴らしいでしょう-これは、「更新」ショートカットを押したときに別のファイルのコンテンツを取り込む場所でHTMLファイルに貼り付けることができるコメントのように機能します。ただし、JS では機能しないか、コンテンツを前処理します。

4

2 に答える 2

0

http://jsfiddle.net/MRJKb/1/

html を json に変換します。

JSON.stringify(your_html_element.outerHTML)

html に戻す:

JSON.parse(your_json_string);

完全なフィドル：

<p>Original string:</p>

<div id="template">
    <div>
        My HTML here including whitespace...
    </div>
</div>

<p>JSON representation:</p>
<textarea rows="2" cols="60"></textarea>

<p>Back to html:</p>

<div id="output"></div>

そしてJavaScript：

$('textarea').val(
    JSON.stringify($('#template').html())
)
$('#output').html(JSON.parse($('textarea').val()))
于 2013-07-04T16:32:42.290 に答える