js里怎么用<%%>

npm install ejs

配置EJS

接下来，在你的Node.js应用程序中配置EJS。通常，这一步是在应用程序的主文件（如 app.js 或 server.js）中完成的。

const express = require('express');
const app = express();
// 设置视图引擎为EJS
app.set('view engine', 'ejs');
// 设置视图文件夹
app.set('views', path.join(__dirname, 'views'));

使用EJS模板

在配置好EJS后，可以创建一个EJS模板文件。在项目的 views 文件夹中创建一个新的文件，例如 index.ejs。在这个文件中，可以使用 <%%> 来嵌入JavaScript代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1><%= title %></h1>
    <p><%= message %></p>
</body>
</html>

向模板传递数据

在服务器端，可以通过渲染模板并传递数据来动态生成HTML页面。例如：

app.get('/', (req, res) => {
    res.render('index', { title: 'Hello, World!', message: 'Welcome to EJS Template!' });
});
app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

在模板中使用 <%%>

在EJS模板中，<%%> 有三种主要用法：

插入值（<%= %>）：用于输出变量的值。
执行代码（<% %>）：用于执行任意的JavaScript代码，但不输出结果。
不转义HTML（<%- %>）：用于输出变量的值，并且不对HTML进行转义。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <!-- 插入值 -->
    <h1><%= title %></h1>
    <p><%= message %></p>
    <!-- 执行代码 -->
    <% if (showList) { %>
        <ul>
            <% items.forEach(item => { %>
                <li><%= item %></li>
            <% }); %>
        </ul>
    <% } %>
    <!-- 不转义HTML -->
    <div><%- rawHtml %></div>
</body>
</html>

详细描述：

插入值（<%= %>）：这种用法用于在模板中插入变量的值，并且会对HTML进行转义处理，防止XSS攻击。例如 <%= title %> 会输出变量 title 的值，并且会对HTML特殊字符进行转义。

执行代码（<% %>）：这种用法允许在模板中执行任意的JavaScript代码，但不会输出结果。例如，可以用它来进行条件判断或循环操作。

不转义HTML（<%- %>）：这种用法与 <%= %> 类似，但不会对HTML进行转义处理。如果你确定插入的内容是安全的，可以使用这种方式输出原始HTML。

通过以上步骤，你可以在JavaScript中使用 <%%> 来动态生成HTML页面，极大地方便了开发动态网页应用。EJS的灵活性和简洁性使其成为很多开发者的首选模板引擎。

js里怎么用<%%>

相关问答FAQs：