0

テンプレートの基本を理解しようとしていますが、次のような問題があります。IDHTMLコードのタグにorまたは/およびtype属性を付けようとすると<script>、機能しません。

<!DOCTYPE html>
<html>

           <head>
                 <link rel="stylesheet" type="text/css" href="style.css">
             <script src="somescript.js"></script>

           </head>
           <body>

    <script type="text/html" id="template1">
                <form name="formXY">
                    <p>
                        <label>Field1
                            <input type="text" name="form_field1" value= "{{field1}}">
                        </label>
                        <button type="button">Submit</button>
                    </p>
                </form>
            </script>
</body>
</html>

私はこれをchrome/firefox / IE9 / Operaで実行しましたが、<script>タグ間のコードを解析するものはありませんでした。ブラウザは、それが単なるテキストフィールドであると考えています。属性を削除するIDと、type再び正しく解析されます。

私はおそらく非常に基本的なものが欠けています...

4

2 に答える 2

2

type要点は、ブラウザーに (javascript として) 解析させたくないということであり、カスタムを使用することtypeで、ブラウザーはそれを無視します (JavaScript でそれを取得するまで)。は)

<!DOCTYPE html>
<html>

<head>
   <link rel="stylesheet" type="text/css" href="style.css">
   <script src="somescript.js"></script>

</head>
<body>

    <script type="text/x-handlebars-template" id="template1">
        <form name="formXY">
        <p>
            <label>Field1
            <input type="text" name="form_field1" value= "{{field1}}">
            </label>
            <button type="button">Submit</button>
        </p>
        </form>
    </script>
</body>
</html>

そして、あなたのJavaScriptで、somescript.jsこのようなものを使ってそのスクリプトタグの内容を取得する必要があります

var uncompiledTemplate = document.getElementById('template1').innerHtml;

// then pass this template to your templating engine...
// if your using handlebars:
var template = Handlebars.compile(uncompiledTemplate);

その後、テンプレートを操作できます。

于 2013-01-12T23:18:17.813 に答える
0

タグのコンテンツが<script>DOM 要素に解析されることはなく、コンテンツは DOM にテキストとして表示されるだけです (ただし、デフォルトで<script>はテキストdisplay:none;であるため、ページには表示されません)。atypeが提供される場合、実行を試みる前にブラウザが認識できるものでなければなりません。古いブラウザではlanguage代わりに属性が使用されていたことに注意してください。

于 2013-01-12T23:41:57.453 に答える