已解決430363個問題，去搜搜看，總會有你想問的

請問關于前端模板原理

關注

首頁猿問請問關于前端模板原理

JavaScript Html5

hy_wang 2018-04-11 16:02:33

請問這個模板原理是怎么樣實現的？使用html接受一個js腳本是什么意思以及請問data中那么多數據，可是模板中只有2個div這應該怎么替換？沒有對應的就不替換了嗎

查看完整描述

1 回答

碼農2號

TA貢獻151條經驗獲得超48個贊

在html里面遍歷，有多少數據就會有多少div。你的模板使用方法我沒驗證對不對，但是絕對有局限性，我們都不是這樣用的。

反對回復 2018-04-12

hy_wang
請教一下平常日常開發您都是怎么使用的萬分感謝

回復 2018-04-12
碼農2號
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>模板使用</title> </head> <body> <ul class="container"></ul>  <script type="text/html" id="tpl">  {{each data as v i}}  <li>{{v.xxx}}</li> {{/each}} </script>  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>  <script src="./template.js"></script> <script> // 找到父元素,確定插入數據的位置 var container=$('.container'); $.ajax({ type: 'post', // url地址需要你自己寫，你需要請求的地址 url: 'xxxx', dataType: 'json', data: { //此處不傳參數可以不寫 }, async: false,//此行是同步異步的處理，一般不用寫 success: function (data) { // 打印一下獲取的data值 console.log(data); // 模板的渲染 //注意：tpl是上面<script type="text/html" id="tpl"></script>中的id，可以自己修改，但上下一定要一致 container.html(template("tpl", data)); } }) </script> </body> </html>

回復 2018-04-12
碼農2號
很簡單的一個模板引用與渲染，自己調整一下自己的值

回復 2018-04-12

關注

舉報

0/150

提交

取消