引言
在js开发中,经常会通过拼接html字符串,来为前端页面动态增加元素。然而,这种方式非常不直观且不便于后期维护。尤其当添加的元素量较大时,与之相关的js代码会显得十分杂乱。针对此种情况,本文以通过js生成一个静态html页面代码块为例,结合Ecmascript6动态字符串标准和网友自定义的format函数,来分享一下js组织html代码块心得。
1 Ecmascript6动态字符串标准
Ecmascript6规定动态字符串用反引号“,动态字符串中需要引用变量的地方,只需参照${var}形式即可,样例如下:
var id="div1"
var divHtmlBlock=`<div id="${id}"></div>`;
2 js自定义扩展format函数
此函数同样用于组织动态代码块,但同时适用于引号和反引号两张形式的字符串。
format函数定义如下:
//判断是否为空对象
function isEmptyObject(e) {
var t;
for (t in e)
return !1;
return !0
}