开发者社区> 问答> 正文

大量的重复的html标签元素。比如40a 50img 30div 如何操作? 是直接复制粘贴html 还是用js操作呢?

大量的重复的html标签元素。比如40个a标签类容不一样 50img 30div 如何操作? 是直接复制粘贴html 还是用js操作呢?哪个更好呢?

展开
收起
杨冬芳 2016-06-20 13:48:21 2410 0
1 条回答
写回答
取消 提交回答
  • IT从业

    •最简单的一个办法,自己构建个最原始的js模板,然后动态的输出去,这个思路并不难,技术上也不难。

    •字符串拼接也是可以的,只是比较low而已。

    •引入第三入模板也是可以的,只是文件有点大,有一定的学习成本而已。

    在线demo

    var tpl = function(html, data){
        return html.replace(/{{(\w+)}}/g, function(item, a, b){
            return data[a];
        });
    }
    var wrap = function(html, data){
        var result = '';
        for(var i = 0; i < data.length; i++){
            result += tpl(html, data[i]);
        }
        return result;
    }
    var str = '<h1>{{name}}</h1><p>{{age}}</p>';
    var json = [
        { name : 'jikey', age : 30 },
        { name : 'tang', age : 10 },
        { name : 'hq', age : 20 }
    ]
    document.getElementById('div').innerHTML = wrap(str, json);

    参考:

    •JavaScript模板引擎原理,几行代码的事儿

    2019-07-17 19:44:05
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
JavaScript面向对象的程序设计 立即下载
JavaScript函数 立即下载
天猫HTML5互动技术实践 立即下载