<body>
  <table class="body" style="height: 100% ; width: 100% ; border-spacing: 0 ; border-collapse: collapse"> 
    <tbody>
     <tr> 
      <td style="font-family: 'blinkmacsystemfont' , 'segoe ui' , 'roboto' , 'oxygen' , 'ubuntu' , 'cantarell' , 'fira sans' , 'droid sans' , 'helvetica neue' , sans-serif"> 
       <table class="header row" style="width: 560px; margin: 0 auto; border-spacing: 0 ; border-collapse: collapse ;"> 
        <tbody>
         <tr> 
          <td class="header__cell" style="font-family:'blinkmacsystemfont' , 'segoe ui' , 'roboto' , 'oxygen' , 'ubuntu' , 'cantarell' , 'fira sans' , 'droid sans' , 'helvetica neue' , sans-serif"> 
            <h2 style="font-weight: normal;font-size: 24px;margin: 0 0 10px;">親愛的 , </h2>
            <p>您已同意加入cosmart会员与会籍!</p>
            <p>如對以上資料有任何查詢,請電郵至<a href="mailto:[email protected]" target="_blank" style="color: #1990c6;text-decoration:none;">[email protected]</a>。</p>
          </td> 
         </tr> 
         <tr><td height="40"></td></tr>
          </tbody>
       </table> 
       <table  class="row footer" style="width: 100% ; border-spacing: 0 ; border-collapse: collapse ; border-top-width: 1px ; border-top-color: #e5e5e5 ; border-top-style: solid"> 
        <tbody>
         <tr> 
          <td class="footer__cell" style="font-family: 'blinkmacsystemfont' , 'segoe ui' , 'roboto' , 'oxygen' , 'ubuntu' , 'cantarell' , 'fira sans' , 'droid sans' , 'helvetica neue' , sans-serif ; padding: 35px 0"> 
           <center> 
            <table class="container" style="width: 560px ; text-align: left ; border-spacing: 0 ; border-collapse: collapse ; margin: 0 auto"> 
             <tbody>
              <tr> 
               <td style="font-family:'blinkmacsystemfont' , 'segoe ui' , 'roboto' , 'oxygen' , 'ubuntu' , 'cantarell' , 'fira sans' , 'droid sans' , 'helvetica neue' , sans-serif"> <p class="disclaimer__subtext" style="color: #999 ; line-height: 150% ; font-size: 14px ; margin: 0">如有任何疑問,請回覆本電子郵件或透過 <a href="mailto:[email protected]" style="color: #1990c6;text-decoration:none;">[email protected]</a> 聯絡我們</p></td> 
              </tr> 
             </tbody>
            </table> 
           </center> </td> 
         </tr> 
        </tbody>
       </table>
      </td>
     </tr> 
    </tbody>
   </table> 
</body>
</html>
 

EJS online compiler

Write, Run & Share EJS templates online using OneCompiler’s EJS online compiler for free. It’s a minimal yet powerful online playground for rendering dynamic HTML using Embedded JavaScript (EJS). Getting started with OneCompiler’s EJS editor is quick and easy. You get a sample boilerplate EJS code with every new session.

About EJS

EJS (Embedded JavaScript templating) is a simple templating language that lets you generate HTML markup with plain JavaScript. It is commonly used in Node.js applications, especially with Express, to render views on the server side.

EJS syntax allows embedding JavaScript logic directly within HTML using <% %> delimiters.

Sample Code

The following is a sample EJS template that displays a personalized greeting:

<%
 let message = 'Hello, World!'
%>
<%= message %>

Syntax Basics

Output Data

  • <%= %> — Outputs the value into the template (escaped)
  • <%- %> — Outputs unescaped HTML
<p>Hello, <%= user.name %>!</p>
<%- include('footer') %>

Control Flow

  • <% %> — Executes JavaScript logic without output
<% if (user.isLoggedIn) { %>
  <p>Welcome, <%= user.name %>!</p>
<% } else { %>
  <p>Please log in.</p>
<% } %>

Loops

<ul>
<% items.forEach(function(item) { %>
  <li><%= item %></li>
<% }); %>
</ul>

Partials (Includes)

<%- include('header') %>
<main>
  Content goes here
</main>
<%- include('footer') %>

This guide provides a quick reference to EJS templating syntax and usage. Start writing and rendering EJS code with OneCompiler’s EJS online compiler today!