方式一:
const ejs = require('ejs');
const arr = ['小明', '小红', '小张']
// 原生JS
// let str = '<ul>'
// arr.forEach(item => {
// str += `<li>${item}</li>`;
// })
// str += '</ul>'
// console.log(str);
// EJS实现
let result = ejs.render(`<ul>
<% arr.forEach(item => { %>
<li><%= item %></li>
<% }) %>
</ul>`, { arr: arr });
console.log(result)
输出结果:
方式二(推荐):
const ejs = require('ejs');
const arr = ['小明', '小红', '小张']
// 原生JS
// let str = '<ul>'
// arr.forEach(item => {
// str += `<li>${item}</li>`;
// })
// str += '</ul>'
// console.log(str);
// EJS实现
const fs = require('fs');
const html = fs.readFileSync('./02_html.html').toString();
let result = ejs.render(html, { arr: arr });
console.log(result)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul>
<% arr.forEach(item => { %>
<li><%= item %></li>
<% }) %>
</ul>
</body>
</html>
输出结果: