使用 JavaScript 创建简单的视图引擎

Creating simple view engine using JavaScript

如何使用像 Mustache 这样的 JavaScript 创建简单的视图引擎,以便 {{ }} 之间的单词被其值替换,例如:

<p>hey there {{ codeName }}</p>
codeName = 'JavaScript 6'

以便将其转换为:

<p>hey there JavaScript 6</p>

我发现以下是正确的方法:

var templater = function(html){
  return function(data){
  for(var x in data){
    var re = "{{\s?" + x + "\s?}}";
    html = html.replace(new RegExp(re, "ig"), data[x]);
  }
  return html;
 };
};

var template = new templater("<p>hey there {{ codeName }}</p>");
var div = document.createElement("div");
div.innerHTML = template({
  codeName: "JavaScript 6"
 });
 document.body.appendChild(div);

参考是here