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

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

已邀请:

renxianpeng

赞同来自:

静态页面写html不就行了。

lvqiang123

赞同来自:

  • 最简单的一个办法,自己构建个最原始的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);

参考:

hh337

赞同来自:

刚开始,没仔细看楼主问题,想这,用 emmet 就行了。
现在看明白了,楼主的意思是相比较两种情况下那种方式最好,肯定是用JS吧!你可以控制输出内容,大小,什么时候显示等。

要回复问题请先登录注册