web-dev-qa-db-ja.com

スクリプトtype = "text / html"の現代的な使用法は何ですか？この例は適切な使用法と見なされますか？

のようなものです...

<script type="text/html" id="this-content1">
<h1>This Header Info One</h1>
<p>This content one. . .</p>
</script>
<script type="text/html" id="this-content2">
<h1>This Header Info Two</h1>
<p>This content two. . .</p>
</script>

...そしてjQueryを使用して、今日の標準のセレクターの優れた実践に基づいてコンテンツを交換しますか？

script type = "text/html" ...を使用してコンテンツの動的な変更を許可し、これを行うための多くの方法を見つけています。これがどの方向に進んでいるのか、またこのプラクティスの標準化が行われているのかを説明できる情報源はありますか。

次のようなコードが表示されます...

<div class="thumbnail">
            <# if ( data.uploading ) { #>
                <div class="media-progress-bar"><div></div></div>
            <# } else if ( 'image' === data.type ) { #>
                <img src="{{ data.size.url }}" draggable="false" />
            <# } else { #>
                <img src="{{ data.icon }}" class="icon" draggable="false" />
            <# } #>
        </div>

...スクリプトのtype = "text/html"タグにネストされており、なぜこのように書かれているのか全く分かりません。また、バックボーンでくちばしを濡らしただけで、1ページにコンテンツスワッピングを追加するだけなら、これは少し重いように見えます。

javascriptcsshtml5templates
31
Shane

scriptタグのHTML5仕様 によると、type属性を有効なMIMEタイプに設定して<script>を使用してもまったく問題ありません。これにはtext/htmlやtext/plainなどのMIMEタイプが含まれます。

scriptタグのHTML4仕様 によると、それはそれほど良くありません：

「作成者がHTMLドキュメントに添付できるスクリプトには2種類あります。ドキュメントが読み込まれるときに1回実行されるスクリプトと、特定のイベントが発生するたびに実行されるスクリプト」

テンプレートにバックボーンは必要ありません。あなたは使用することができますjQueryまたは私の個人的なお気に入り、 Mustache.js 。

22
wprl

後で使用するためにHTMLの一部を保存することを想定しています。スクリプトタグに非スクリプトデータを入れることは意味がありません。 Facebookがすることをしてください！

<code class="hide" id="code1"><!--
  <p>My HTML here</p>
  <script>My Javascript here</script>
--></code>

その後、後でHTMLを取得して、後で必要な操作を実行できます。

var html = document.querySelector('#code1').innerText.slice(5, -5)

内部のスクリプトは、適切に処理するまで実行されません。

いくつかのメモ：

  • InnerTextと他のテキスト関数の違いがわからない
  • DOMにスクリプトタグを挿入できるとは思わない。 jQueryがどのようにそれを行うかわからない
3
Jonathan Ong