template模板使用

xiaoxiao2022-07-06  54

为什么使用?

页面布局中存在一样的模块,提出公共的模块,便于维护

基本语法:

<body> //定义要存放的模板容器(父元素) <div id="con"></div> </body> <script id="test" type="text/html"> // type必须是text/html <h1>{{title}}</h1> //第一种循环写法 <ul> {{each list}} <li>{{$index}}------------------{{$value}}</li> {{/each}} </ul> //第二种循环写法 <ul> {{each list as value } <li>{{index}}------------------{{value}}</li> {{/each}} </ul> //if 判断语法 {{if price}} <p>价格:{{price}}</p> {{/if}} </script> <script> var obj={ list:[1,2,3,4], title:"标题" } var html=template('test',obj) //第一个参数是script 的id 第二个是对象,必须是对象 $('#con').append(html)//第一种写法 document.getElementById('con').innerHTML=html//第二种写法 </script>

 

转载请注明原文地址: https://www.6miu.com/read-4968522.html

最新回复(0)