首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

可以让.js页面从.ejs页面读取值吗?

是的,可以让.js页面从.ejs页面读取值。

.ejs是一种嵌入式JavaScript模板引擎,可以在服务器端动态生成HTML代码。它允许将JavaScript代码嵌入到HTML页面中,并通过模板变量来传递数据。

在.ejs页面中,可以通过设置变量来传递值。例如,在.ejs页面中定义一个名为"message"的变量,可以将其值设置为任意内容,比如"Hello World"。

代码语言:txt
复制
<% var message = "Hello World"; %>

然后,在.js页面中,可以通过引入.ejs文件,并使用模板变量来读取这个值。

代码语言:txt
复制
var ejs = require('ejs');
var fs = require('fs');

fs.readFile('example.ejs', 'utf8', function (err, data) {
  if (err) throw err;
  var rendered = ejs.render(data, { message: "Hello World" });
  console.log(rendered); // 输出: Hello World
});

这里使用了Node.js中的fs模块来读取.ejs文件的内容,然后使用ejs.render方法将模板变量传递给.ejs文件并进行渲染。

需要注意的是,.ejs文件是在服务器端渲染的,所以无法直接从前端的.js文件中读取.ejs页面的值。如果需要从前端页面中读取值,可以通过后端提供API接口的方式来实现。例如,前端通过AJAX请求后端API,后端返回.ejs页面中的值供前端使用。

总结起来,通过ejs模板引擎,可以让.js页面从.ejs页面读取值,但需要在服务器端进行处理,并通过后端提供API接口的方式来实现前后端数据的传递。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

模块化

exports曝光内容必须添加属性 module.exports曝光内容,可以添加属性,也可不添加属性 我们可写一些文件,这些js文件完成一些功能,然后曝光,为了方便程序员的开发,node.js官方写了一些模块...Nodejs中的流就跟水流,电流,血流一样的概念,是字节流 字节流 先得有储存字节的地方,流出来才会形成字节流 ----文件中储存的不就都是字节 流 “data” : 当文件中有数据出来时,会触发...node时输入的参数 ----全局对象 Procss用于操作进程的核心模块 util -----Format 以一定的格式显示 -----inspect 层次结构显示对象 Util是node的工具模块,可以...要把.html改成.ejs 2....创建views文件夹把.ejs文件放到views中 就代表页面中要变的那个部分 对应于: render()中的第二个参数 路由 请求方法 加上请求路径就是路由 App.get

1.8K20
  • Nodejs学习笔记(五)--- Express安装入门与模版引擎ejs

    前言   前面也学习了一些Node.js的基本入门知道,现在开始进入Web开发的部分;   Node.js提供了http模块,这个模块中提供了一些底层接口,可以直接使用,但是直接开发网站那还是太累了,...所以http模块也不单讲了,可以去看官方API:http://nodejs.org/api/http.html   下面我们直接Express框架着手去进行Web开发,它实现好了更高层的接口,Web...: 'Express'时,显示效果来看,他直接输出HTML标签到页面上,输出的是转义后的变量值 2.   而这个标签,显示效果上看,他没有直接输出HTML代码到页面上...文件,其中.js后缀省略,用/users访问时,调用routes目录下users.js文件   这就是为什么,我们示例中用http://localhost:8100/访问是,修改的index.js里的文件代码可以执行...index.ejs可以使用,那么加上ejs的部分,就会返回最终生成的页面展现!

    3.7K100

    前后端分离之vue2.0+webpack2 实战项目 -- html模板拼接

    对于php,我们可以利用include加载其他页面,像yii框架,可以利用render将输出的内容嵌入到父模板,从而形成一个完整的页面。 那对于纯静态的html我们如何拼接呢?...html-webpack-plugin默认集成了ejs模板引擎,所以我们可以直接使用ejs模板。当然我们也可以引入其他模板,包括handlebars等都可以使用。...---- 正式构建模板布局框架 既然html-webpack-plugin的template可以接受多个模板,那我们也可以传给它一个js,只要js返回一个模板文件就可以,这样我们拼接的工作都可以js和...,它会把我们的页面内容 income.ejs 传给 html/layout.js,在 layout.js 内,我们会引入html的各个公共部分,并把html/income.js 中定义的各种参数传给页面的各个部分...,可以定义当前页面的title等信息,并规定使用哪个ejs模板进行拼接 /* html/income/income.js */ const content = require('.

    1.5K60

    使用express框架开发,如何在ejs文件中导入外部的js、css文件

    在使用ejs模版的过程中遇到了这个问题:如何在ejs模版中导入外部的js、css文件。 我猜测,ejs和html导入外部文件的方式应该是不一样的。但是我还是决定试一试。...可以看到,其中的public文件夹是其自动生成的,也就是你放静态文件的文件夹。(当然也不是必须是“public”) 好了,继续。...()这个方法具体的介绍,这里有篇文章,写的很好app.use(express.static)方法详解 这样,就可以ejs文件中导入外部静态文件了。 ...笔者这里的情况如下: 基于node.js ,使用express开发一个blog网站: 项目目录: ? 这里引用外部js和css文件的ejs页面的代码: <!...所以上面ejs页面中的引用就不用写public了,这里的好处就是无论ejs页面与public中要引用的文件的相对路径关系是怎样的,都可以直接在ejs中直接引用,引用的方式只需要关注public下的路径,

    9.9K00

    Matery主题添加Pjax

    优化页面跳转体验 使用pjax后,只刷新部分页面,切换效果更加流畅,而且可以定制过度动画,在等待页面加载的时候体验就比较舒服了。...评论页面ejs(我使用的是valine,故我需要将valine.ejs页面进行修改) 谷歌统计页面(google-analytics.ejs) 文章目录(post-detail-toc.ejs) 说说页面...(artitalk.ejs) 标签页面(tags)的词云(tag-wordcloud.ejs) 分类页面(categories)雷达图(category-radar.ejs) 归档页面(archives...)统计图(post-calendar.ejs) 关于页面(about)的统计图(post-charts.ejs) 欢迎提交遗漏bug 标签 (tags)页面为例 当操作完以上步骤后首页点进标签(tags...)页面时会有一下报错 image.png 打开 tags.ejs页面由 tag-cloud tag-wordcloud 两个ejs组成,故要查看这两个 ejs 页面哪里出现了 jQCloud 函数

    1.3K10

    纵览全局垂直打击的组织模式(下)

    其实,在Hexo的框架内,ejs(或其他类型的)模板中的代码就是渲染生成html的代码,在这些页面中,借助Hexo内建的对象,比如.post对象和.achieves对象,可以访问到其中保存的全部文章信息及关联信息...(在渲染前构造、借助.post对象) 关于位置,在ejs模板中放置构造代码当然可以,但是不优雅,Hexo中建议的插入方式是: 在专门放置自定义JavaScript处理逻辑的文件中(plugin.js)放入代码...可视化页面 这里采用的是 D3.js 进行的可视化呈现,基本上是复用的 d3 的官方模板,但将文本信息一并和节点进行可视化展示。...,从而两者不可能出现交集。...待改造代码的输入找格式,然后原代码的框架中构造出该格式的数据(输出),就像适配一样,如此便可以利用Hexo可以获得的数据,借助D3.js等可视化库,把自己的博客(知识系统)做一个梳理和呈现,从而更好的帮助自己管理和维护

    93010

    Hexo-neat插件优化提升访问效率

    答: 可以以下的几个方面去入手: 将js渲染文件尽可能放置到(之前),因为html页面是自上而下(阻塞式)加载的,如果放在(前)会渲染完页面再显示内容,渲染画面是很费时的。...1,尽量避免去引用访问速度非常低下的cdn或者图片,可以改用访问速度更快的cdn,或者将难以迅速加载的图片保存到自己的站点目录下,以免在加载图片时耗费了大量的时间,最后还加载不出来。...2,Github配置cdn和私人picGo图床教程 3,对页面的静态资源进行压缩,包括css、js和html等文件。...【INFO neat the html: xxxx.ejs】压缩ejs配置文件(这里也有很多换行和空格),这是html片段格式文件。...的需要单独列出来(这里引用了fancybox图片弹窗效果,压缩名单里单独剔除) 4,深目录的,需要单独列出来:(这里我引用了live2d看板娘的动画) 单用*/.min.js深目录跳过已压缩文件不行

    2K20

    node.js 第三方模块

    web express web开发框架 ejs 页面模板。可以方便的把html改写成ejs。 eco 页面模板,类似ejs。...与ejs的不同点是:逻辑部分用CoffeeScript而不是javascript jade 页面模板 源自ruby的haml 比ejs优雅简洁,但把html转换成jade要花一番功夫。...log4js 日志。 cheerio 解析html文档。解析的结果可以用jQuery的写法来筛选想要的dom元素。 JSDOM 和cheerio类似。但更强大。但要在windows安装是各种麻烦。...支持 should.js,expect.js,assert,但不支持should.js的某些写法。 should.js 断言库。可读性很强。 expect.js 断言库。...可以做很多任务:如脚本验证(grunt-contrib-jshint),脚本,样式压缩(grunt-contrib-uglify),脚本合并(grunt-contrib-concat),编译coffee

    1.8K30

    hexo配置自己的博客站点

    2. hexo模板介绍 archive.ejs归档列表页模板,归档可以按照年份+月份实现的,list_archives显示列表 模板文件名 说明 layout.ejs 模板的入口文件,也是整个站点的入口文件...index.ejs 首页,布局文件默认输出嵌入的页面 post.ejs 文章详细页 page.ejs 页面 archive.ejs 归档列表页模板,归档可以按照年份+月份实现的,...list_archives显示列表 category.ejs 分类显示页 tag.ejs 标签页 hexo的模板解析,以layout.ejs为入口,所有静态页面(如:文章、页面、首页、标签、归档、分类等...所以每个页面的公共部分应该在写layout.ejs中(如页头、页脚等)。...针对当前模板的配置文件,配置文件中的信息可以ejs模板访问 说明: 1.

    89870

    Node.js 常见面试题速查

    process.argv[1] 当前执行的文件的 JS 文件路径 process.argv.splice(2) 命令行参数 关于获取命令行传来的参数还可以结合 commander 的 commander.parse...对 url 的字符串解析、url 拼接等 url.parse 可以将一个 url 的字符串解析并返回一个 url 的对象 url.format 将传入的 url 对象编程一个 url 字符串并返回 #...、要展示的数据生成HTML页面的工具,本质上是后端渲染(SSR)的需求,加上Node渲染页面本身是纯静态的,当我们需要页面多样化、更灵活,我们就需要使用模板引擎来强化页面,更好的凸显服务端渲染的优势 常见模板引擎...art-templat 号称效率最高的,模版引擎 ejs 是一个 JavaScript 模板库,用来 JSON 数据中生成 HTML 字符串 pug 是一款健壮、灵活、功能丰富的模板引擎,专门为 Node.js...'); app.get('/', (req, res, next) => { res.render('index.ejs', { title: 'ejs' }); }); app.listen

    78910

    Nodejs学习笔记(六)--- Node.js + Express 构建网站预备知识

    前言   前面经过五篇Node.js的学习,基本可以开始动手构建一个网站应用了,先用这一篇了解一些构建网站的知识!   主要是些基础的东西...   ...、usesession.ejs、usecookies.ejs、usecrypto.ejs文件,并在views目录下除了error.ejs外所有ejs文件中添加如下代码 <!...运行界面如下: image.png   点击各链接都能正常跳转到对应的页面!这样第一步的目录就算达到了! 如何提取页面中的公共部分?   在上一步创建的网站中每个页面都几乎一样,现在都只有导航部分?...当然不是,我们可以提取出来 1.在views目录下新建一个nav.ejs文件,并添加如下代码 首页 如何提交表单并接收参数...再回过头看看GET和POST方式接收值,直接效果上来看 req.query:我用来接收GET方式提交参数 req.body:我用来接收POST提交的参数 req.params:两种都能接收到

    2.7K70

    新鲜出炉的前端面经

    客户端怎么处理 JS 事件失效的问题?客户端不重新加载 JS 的情况下怎么实现? 做服务端渲染的时候有没有遇到过比较难的点? react ssr 和 ejs 性能的差异? 服务回滚是怎么做的?...有一个一亿长度的字符串,怎么存储设计可以它更好去查询、修改? 怎么优化 H5 可以在 300ms 之内打开? 你们 WebView 加载一般耗时多久?...输入 url 到页面展示经过了哪些步骤? 讲一下重绘和回流 知道 BFC ?使用场景有哪些? 怎么判断是否为数组? 页面卡顿怎么去定位? 数组有10万个数据,取第一个和取第10万个的耗时多久?...有用过 canvas 相关的JS 垃圾回收机制?怎么定位 Node 内存泄露问题? 你是怎么理解前端的? 工作中遇到过最难的问题?有没有什么你自豪的项目? 周末你都在做什么?...js bridge 通信原理? 怎么实现 h5 页面秒开? 明明不是同一个语言,为什么 js 和 native 可以通信? 怎么实现 js bridge 跨多个 app 共用?

    1.2K31

    TypeScript在react项目中的实践

    就这个结构拆分前后分离其实没有什么成本 在下边分了大概这样的一些文件夹: dir/file desc index.ejs 项目的入口html文件,采用ejs作为渲染引擎 index.tsx 项目的入口js...base.js 可以理解为是webpack的基础配置文件,通用的loader以及plugins在这里 pro.js 生产环境的特殊配置(代码压缩、资源上传) dev.js 开发环境的特殊配置(source-map...但是parser只能有一个,option的命名中就可以看出extends、plugins、rules,到了parser就没有复数了。...node层的修改 除了上边提到的两端公用代码以外,还需要添加一个controller用于吐页面,因为使用的是routing-controllers这个库,渲染一个静态页面被封装的非常棒,仅仅需要修改两个页面.../views'), { options: { ext: 'ejs', }, extension: 'ejs', })) 如果是多个页面,那就创建多个用来Render的ts文件就好了

    1.8K30
    领券