본문 바로가기

프로그래밍/jQuery

[jQuery] jquery 템플릿 (text/x-jquery-tmpl)

반응형

 

 

 

jquery template을 사용하여 데이터를 바인딩해보자

 

<head>
    <script type="text/javascript" src="/js/jquery.tmpl.js"></script>
    <script type="text/javascript">
        // 리스트에 입힐 json 타입 데이터
        var student = [{ Name: "ggmouse", Age: "29" }, { Name: "binggo", Age: "30" }];

        // 데이터 바인딩
        var tmpl = $("#studentTemplate").tmpl(student).appendTo(#studentList);
    </script>
    
    // 리스트에 출력할 템플릿
    <script id="studentTemplate" type="text/x-jquery-tmpl">
        <p>이름: ${Name}</p>
        <p>나이: ${Age}</p>
    </script>
</head>
<body>
    <div id="studentList"></div>
</body>
 
 

 

참고사이트

 

https://github.com/BorisMoore/jquery-tmpl

 

 

반응형