js script type 部分属性值分析

1. text/javascript：

    （1）<script type="text/javascript" src="Js/jquery-1.10.2.min.js"></script> ---引用外部js

    （2）编码js代码

2.text/template&&text/html

    <script id="commentTemplate" type="text/template">
        <li>
            <div class="photo">
                <a href="#">
                    <img src="[UserImg]" /></a>
            </div>
            <p>
                <a href="#">[UserName]：</a><span class="time">[CreateDate]</span>
            </p>
            <div class="clear">
            </div>
        </li>
    </script>

<div id="comment_ul_2">
        </div>
        <input type="button" id="addFun" value="click me" />
        <script type="text/javascript">
            var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
            $("#addFun").click(function () {
                var html = document.getElementById("commentTemplate").innerHTML;
                var source = html.replace(reg, function (node, key) { return { 'UserImg': '1', 'UserName': 'zhang', 'CreateDate': '2011-1-1' }[key]; });
                $("#comment_ul_2").append(source);
            });

            var zzl = "name:[name]";
            zzl = zzl.replace(reg, function (node, key) { return { 'name': '占占' }[key]; });
            //alert(zzl);

        </script>

3.type="text/x-handlebars-template"

 

        <div id="list">

        </div>
        <script type="text/javascript" src="Js/handlebars.js"></script>
        <script id="people-template" type="text/x-handlebars-template">
            {{#people}}
        <div class="person">
            <h2>{{first_name}} {{last_name}}</h2>
            <div class="phone">{{phone}}</div>
            <div class="email"><a href="mailto:{{email}}">{{email}}</a></div>
            <div class="since">User since {{member_since}}</div>
        </div>
            {{/people}}
        </script>
        <script type="text/javascript">
            $(document).ready(function () {

                // compile our template
                var template = Handlebars.compile($("#people-template").html());

                var data = {
                    people: [
                      { first_name: "rui", last_name: "fengyun", phone: "1234567890", email: "alan@test.com", member_since: "Mar 25, 2011" },
                      { first_name: "Allison", last_name: "House", phone: "0987654321", email: "allison@test.com", member_since: "Jan 13, 2011" },
                      { first_name: "Nick", last_name: "Pettit", phone: "9836592272", email: "nick@test.com", member_since: "Apr 9, 2009" },
                      { first_name: "Jim", last_name: "Hoskins", phone: "7284927150", email: "jim@test.com", member_since: "May 21, 2010" },
                      { first_name: "Ryan", last_name: "Carson", phone: "8263729224", email: "ryan@test.com", member_since: "Nov 1, 2008" }
                    ]
                };

                $('#list').html(template(data));
            });
        </script>