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

 1     <script id="commentTemplate" type="text/template">
 2         <li>
 3             <div class="photo">
 4                 <a href="#">
 5                     <img src="[UserImg]" /></a>
 6             </div>
 7             <p>
 8                 <a href="#">[UserName]:</a><span class="time">[CreateDate]</span>
 9             </p>
10             <div class="clear">
11             </div>
12         </li>
13     </script>
 1 <div id="comment_ul_2">
 2         </div>
 3         <input type="button" id="addFun" value="click me" />
 4         <script type="text/javascript">
 5             var reg = new RegExp("\\[([^\\[\\]]*?)\\]", ‘igm‘); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
 6             $("#addFun").click(function () {
 7                 var html = document.getElementById("commentTemplate").innerHTML;
 8                 var source = html.replace(reg, function (node, key) { return { ‘UserImg‘: ‘1‘, ‘UserName‘: ‘zhang‘, ‘CreateDate‘: ‘2011-1-1‘ }[key]; });
 9                 $("#comment_ul_2").append(source);
10             });
11
12             var zzl = "name:[name]";
13             zzl = zzl.replace(reg, function (node, key) { return { ‘name‘: ‘占占‘ }[key]; });
14             //alert(zzl);
15
16         </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: "[email protected]", member_since: "Mar 25, 2011" },
                      { first_name: "Allison", last_name: "House", phone: "0987654321", email: "[email protected]", member_since: "Jan 13, 2011" },
                      { first_name: "Nick", last_name: "Pettit", phone: "9836592272", email: "[email protected]", member_since: "Apr 9, 2009" },
                      { first_name: "Jim", last_name: "Hoskins", phone: "7284927150", email: "[email protected]", member_since: "May 21, 2010" },
                      { first_name: "Ryan", last_name: "Carson", phone: "8263729224", email: "[email protected]", member_since: "Nov 1, 2008" }
                    ]
                };

                $(‘#list‘).html(template(data));
            });
        </script>
时间: 2025-01-03 15:07:11

js script type 部分属性值分析的相关文章

html中设置data-*属性值 并在js中进行获取属性值

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ajax file</title> <script src="./js/jquery-1.12.4.min.js"></script> <script> $(function(){ // 获取data-

JS 获取元素的属性值,非内联样式

//获取样式表的属性值,IE8及以下不兼容 ,方法 window.getComputedStyle(dom对象,"伪类").style属性; //IE8及以下获取样式表的属性值 ,属性 element.currentStyle.style属性; 判断浏览器是否兼容 getComputedStyle 和 currentStyle if( window.getComputedStyle ){ } else if( document.body.cyrrentStyle ){ }

js中的innerText、innerHTML、属性值、value与jQuery中的text()、html()、属性值、val()总结

js与jQuery获取text.html.属性值.value的方法是不一样的. js与jQuery,text与innerText获取(<!---->中为结果) html: <p id="test">这是段落中的 <b>粗体</b> 文本.</p> <button id="btn10">jQuery显示text</button> <!--Text: 这是段落中的 粗体 文本.--

js checkbox获取选中的值

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> /*设置css样式*/ div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;} div.box span{color

js 动态修改属性值 动态修改图片,字等

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <meta http-equiv = "content-type" content="text/html;charset=utf-8"/> &

js和jquery通过this获取html标签中的属性值

<html>    <head>        <script type="text/javascript" src="jquery-1.10.2.min.js"></script>        <script type="text/javascript">            /** JQUERY 通过当前标签属性名,获取属性的值   */            function

js如何获取给定属性的属性值

js如何获取给定属性的属性值:在一些实际应用中需要取得给定属性的属性值,下面就简单介绍一下如何实现次效果.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>蚂蚁部落</ti

js中获取css样式属性值

关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. (2)currentStyle可以弥补style的不足(可获取内联样式,内部样式和外部样式),但是只适用于IE. (3)getComputedStyle同currentStyle作用相同,但是适用于FF.opera.safari.chrome. 注意: ① currentStyle和getComputedS

js解析xml,获取XMl标签属性值

<script type="text/javascript"> var xml="<?xml version=\"1.0\" encoding=\"UTF-8\"?>" +"<RecordInfo camId=\"1000000$1$0$0\" count=\"12\" />"; $(function(){ //加载xmlDoc v