使用underscore模块的template功能实现对HTML的数据注入+template实现数据注入（后面更新）
Posted 勇敢*牛牛
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使用underscore模块的template功能实现对HTML的数据注入+template实现数据注入（后面更新）相关的知识，希望对你有一定的参考价值。
使用underscore模块的template功能实现对html的数据注入
- 安装underscore
代码是：npm i underscore
- 查看是否安装成功
server.js文件
var http = require('http');
const fs = require('fs');
var _ = require("underscore");
var server = http.createServer();
server.on('request', function (req, res)
var music =
Id: 1002,
title: '梦里水乡',
singer: '老八秘制小汉堡',
type: '奥利给'
const url = req.url;
if (url === '/show')
fs.readFile(__dirname + url + '.html', 'utf-8', function (err, data)
if (err)
res.end(err.message);
else
var compiled = _.template(data);//解析执行函数
var htmlstr = compiled(music);//调用函数，注入数据
res.end(htmlstr);//显示页面
)
else
res.end('404 not found!!!!!!');
);
server.listen(3000, "127.0.0.1", function ()
console.log("server is listening 127.0.0.1:3000");
);
show.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>歌单</title>
</head>
<body>
<ul>
<li>歌曲信息: <%=Id%>
</li>
<li>歌曲名称:<%=title%>
</li>
<li>歌手:<%=singer%>
</li>
</ul>
</body>
</html>
显示效果
以上是关于使用underscore模块的template功能实现对HTML的数据注入+template实现数据注入（后面更新）的主要内容，如果未能解决你的问题，请参考以下文章
如何让 webpack2 和 underscore-template loader + babel 工作而不会出现“模块构建失败：SyntaxError：'with' in strict mode (