顾名思义,就是用反引号编写一个模板字符串,
用echo将模板转为javascrip表达式字符串,
用正则将基础字符串转为想要字符串
将代码封装在函数中返回;
注:
用到es6属性${}
var template=`
<ul>
<%for(var i=0;i<data.supplies.length;i++){%>
<li><%=data.supplies[i]%> </li>
<%}%>
</ul>`;
function compile(template){
var reg1=/<%=(.+?)%>/g;
var reg2=/<%([\s\S]+?)%>/g;
template=template
.replace(reg1,'`);\n echo($1); \n echo(`')
.replace(reg2,'`);\n $1 \n echo(`');
template='echo(`'+template+'`)';
var script=`
(function parse(data){
var outpput='';
function echo(html){
output+=html
}
${template}
return output;
)}`
return script
}
var parse=eval(compile(template));
div.innerHTML=parse({supplies:['1',,'2','3']});
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· .NET Core 中如何实现缓存的预热?
· 三行代码完成国际化适配,妙~啊~
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?