V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
leben
V2EX  ›  问与答

求Javascript template的最佳实践

  •  
  •   leben · 2012-12-07 13:12:50 +08:00 · 4082 次点击
    这是一个创建于 4164 天前的主题,其中的信息可能已经有所发展或是发生改变。
    手头上在实现一个弹出层显示员工档案,员工档案用table列表,支持搜索。
    以前都是在服务器端把整个html拼好,现在像只返回json,然后在前段用hogan.js生成html。

    1、我现在页面里text/templdate放模板,但是这个弹出层在几个页面都用到,是不是只能把模板html用字符串放在js文件里?

    2、因为支持搜索,弹出层里的table数据可能会发生变化,每次都要用templdate生成rows html,然后再替换table里面的html。

    感觉用template在生成html这个阶段的确很方便,但是如果涉及复用和数据刷新就不是特别舒服。
    没有经验,求有经验的给点儿指点,谢谢!
    10 条回复    1970-01-01 08:00:00 +08:00
    powerfj
        1
    powerfj  
       2012-12-07 13:16:38 +08:00   ❤️ 1
    1 可以放页面的某个隐藏div里面的 注释里面,然后通过字符串操作拿到
    貌似也可以放隐藏的txtarea的value里面

    2 每次都生成没什么的,基本上不差
    aisensiy
        2
    aisensiy  
       2012-12-07 13:22:01 +08:00
    我觉得你主要是为了复用方便对吧,那你可以把template单独写一个文件,然后在后端渲染的时候引入这个文件。
    当然,这样感觉是又倒回去了,不过这样改成本比较小。
    leben
        3
    leben  
    OP
       2012-12-07 13:23:06 +08:00
    @powerfj
    1、因为我要在好几个页面都用这个弹出框,难道我要在每个用到的页面里面都放这个隐藏div?我以前从服务器端返回整个html,也是觉得每次都在客户端拼很麻烦。另外我感觉<script type="text/template" >比隐藏DIV好,你可以试试。
    2、每次生成的麻烦就是,这个弹出层我要做两个模板,一个是第一次生成的时候,包括搜索框、标题这些在内的,另外一个仅仅包括行格式,每次搜索之后,用第二个生成row html,然后替换弹出层里面table>tbody。我就是觉得这个很麻烦。
    leben
        4
    leben  
    OP
       2012-12-07 13:25:13 +08:00
    @aisensiy
    后台用的PHP Codeigniter。
    我再看backbone,对前端不是很熟,看着晕啊,呵呵。
    greatghoul
        5
    greatghoul  
       2012-12-07 13:32:51 +08:00
    我一般是
    <script type="text/x-tmpl-mustache" id="tpl-alert">
    <div class="alert {{#type}}alert-{{type}} {{/type}} fade in">
    <button type="button" class="close" data-dismiss="alert">×</button>
    {{{ message }}}
    </div>
    </script>


    然后用 https://github.com/janl/mustache.js

    $('#tpl-alert').mustache({ type: type, message: message }).appendTo(...);
    greatghoul
        6
    greatghoul  
       2012-12-07 13:34:15 +08:00
    @leben 如果你是在很多个页面都用的话,把这部分放在一个公共的页面中,PHP里面 include 不就成了?
    powerfj
        7
    powerfj  
       2012-12-07 13:56:09 +08:00
    @leben 和放script标签里面差不多,一般我都是放在那个需要填充的div里面,这样就知道哪个模板需要放哪里了,然后如果需要看效果把注释去掉就好.

    对于两个模板这里,可以考虑放一个模板里面,子模板的概念,然后每次填充的时候就是子模板内容不一样
    aisensiy
        8
    aisensiy  
       2012-12-07 14:12:39 +08:00
    @leben @greatghoul ci 是个好框架,我也用过,我说的方法就是include即可。
    bitsmix
        9
    bitsmix  
       2012-12-07 14:37:52 +08:00
    jade
    leben
        10
    leben  
    OP
       2012-12-07 16:18:20 +08:00
    @greatghoul
    @powerfj
    @aisensiy
    谢谢,脑子抽筋了,老是把后端和前段分的那么清,的确用include就万事了,谢谢各位了。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2215 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 103ms · UTC 09:16 · PVG 17:16 · LAX 02:16 · JFK 05:16
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.