ホームページ > 記事 > ウェブフロントエンド > Node.js での EJS テンプレートの使用に関するチュートリアル
この記事は主に EJS テンプレートのクイックスタート学習を紹介しています。編集者が非常に優れていると考えたので、参考として共有します。エディターをフォローして見てみましょう。Node オープンソース テンプレートには多くの選択肢がありますが、
Classic ASP/PHP/JSP の経験がある場合は、EJS を使用することをお勧めします。当然、EJS を使用できます。つまり、最も伝統的な方法である d85c79a929bc8ca626621b97151165d7 を使用して、JavaScript コードを 9613d184b92a8db8e14f8dcd66cf91f2 ブロック内に配置できます。追加 211d170dd2338981536b694e744db878" js ロジック コードが含まれています。 8b95f35e5e88078811040fade31b8cf7" には、php の echo の関数と同様に、直接出力するための変数が含まれています。 "p" は、以下の build メソッドを呼び出すときの k-v オブジェクトのパラメーターです。また、"new JTemp" を呼び出すときに別のパラメーター名に設定することもできます。 上記の temp が生成された後、build メソッドは複数回呼び出される場合は、HTML が生成されます。以下はテンプレート エンジンのコードです: 中心となるのは、テンプレート コードを文字列を結合する関数に変換し、データを取得するたびにこの関数を呼び出すことです。 主に携帯電話(Webkit)で使用されるため、文字列結合の効率は考慮されていません。IEで使用する必要がある場合は、文字列結合メソッドをArray.push()に変更するのが最善です。
Call: <html>
<head>
<script src="../ejs.js"></script>
<script id="users" type="text/template">
<% if (names.length) { %>
<ul>
<% names.forEach(function(name){ %>
<li><%= name %></li>
<% }) %>
</ul>
<% } %>
</script>
<script>
onload = function(){
var users = document.getElementById('users').innerHTML;
var names = ['loki', 'tobi', 'jane'];
var html = ejs.render(users, { names: names });
document.body.innerHTML = html;
}
</script>
</head>
<body>
</body>
</html>
<script id="test_list" type="text/html">
<%=
for(var i = 0, l = p.list.length; i < l; i++){
var stu = p.list[i];
=%>
<tr>
<td<%=if(i==0){=%> class="first"<%=}=%>><%==stu.name=%></td>
<td><%==stu.age=%></td>
<td><%==(stu.address || '')=%></td>
<tr>
<%=
}
=%>
</script>
$(function(){
var temp = new JTemp('test_list'),
html = temp.build(
{list:[
{name:'张三', age:13, address:'北京'},
{name:'李四', age:17, address:'天津'},
{name:'王五', age:13}
]});
$('table').html(html);
});
3.
php.cn Dugu Jiijian (3) - JavaScriptビデオチュートリアル以上がNode.js での EJS テンプレートの使用に関するチュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。