phw*_*563 12 html javascript mustache
在我的胡子模板中,我确实有类似的东西:
<div {{attr}}="{{attrVal}}"></div>
使用此渲染
Mustache.render(template, {attr : 'data-test', attrVal : 'test'})
生产
<div ="test"></div>
我希望得到类似的东西
<div data-test="test"></div>
是不是可以使用Mustache在标签内呈现属性名称？
UPDATE
我解决了这个问题.我<template>在我的文档中的自定义标记内定义了我的HTML胡须模板.例如:
<template id='myTemplate'>
<div {{dataAttr}}="{{dataAttrValue}}"></div>
</template>
使用document.querySelector("#myTemplate").innerHTML浏览器获取模板时确实将转换为{{dataAttr}}to,{{dataattr}}因为属性不区分大小写.所以打电话
Mustache.render(
document.querySelector("#myTemplate").innerHTML,
{ dataAttr : 'data-attr', dataAttrValue : 'test'}
);
结果是
<div ="test"></div>
小智 1
希望这段代码片段能对您有所帮助。
var template = document.querySelector("#template").innerHTML;
//Mustache.parse(template); // optional, speeds up future uses
var rendered = Mustache.render(template, {
attr: "data-test",
attrVal: "test"
});
document.querySelector("#target").innerHTML = rendered;<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.2.1/mustache.js"></script>
<body>
<div id="target">Loading...</div>
<template id="template" >
<textarea style="width:300px">
<div {{attr}}="{{attrVal}}"></div>
</textarea>
</template>
</body>| 归档时间： |
|
| 查看次数： |
4470 次 |
| 最近记录： |