模板頁面,可以利用插槽的方式,等待其他頁面繼承并填入
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
{{block 'head'}}{{/block}}
<title>Document</title>
</head>
<body>
{{include './header.html'}}
<!-- 插槽 -->
{{block 'content'}}
<h1>默認內容</h1>
{{/block}}
{{include './footer.html'}}
<script src="/node_modules/jquery/dist/jquery.js"></script>
<script src="/node_modules/bootstrap/dist/js/bootstrap.js"></script>
{{block 'script'}}{{/block}}
</body>
</html>
```
index.html 繼承 layout.html
```html
{{extend './layout.html'}}
{{block 'head'}}
<style>
body {
background-color: cadetblue;
}
</style>
{{/block}}
{{block 'content'}}
<div>
<h1>index 頁面填坑內容</h1>
</div>
{{/block}}
{{block 'script'}}
<script>
console.log(1);
</script>
{{/block}}
```
- 1. Node.js介紹
- 2. Node讀取文件
- 3. Node寫文件
- 4. http服務
- 5. 發送文件中的數據以及Content-Type內容類型
- 5.1 仿制接口
- 6. Node.js中的模塊系統
- 7. 在node中使用模板引擎
- 8. 服務端渲染與客戶端渲染
- 9. exports 與 module.exports的區別
- 10. npm
- 11. Express
- 0. 安裝
- 1. 開放端口以及靜態資源
- 2. 基本路由
- 3. Express使用art-template
- 4. 在Express中獲取表單POST請求體數據
- 5. 使用Express路由模塊
- 6. Express 跨域
- 7. md加密
- 12. nodemon實現代碼修改自動重啟
- 13. MongoDB
- 13. MongoDB安裝與介紹
- 14. 啟動和關閉mongoDB
- 15. 連接和退出MongoDB數據庫
- 16. 基本命令
- 17. 在node中操作mongodb數據庫
- 18. mongoDB開始&新增數據
- 19. 查詢
- 附:Express留言板項目
- 20. path 路徑操作模塊
- 21. Node 中的其他成員
- 22. art-template中的include用法
- 附:學生信息管理系統