首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在Node.js中向基于Jade的视图的head部分添加额外的javascript

如何在Node.js中向基于Jade的视图的head部分添加额外的javascript
EN

Stack Overflow用户
提问于 2018-06-28 07:43:28
回答 2查看 364关注 0票数 0

我有一个Node.js express web应用程序。

layout.jade看起来像这样

代码语言:javascript
复制
doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
    block extraHeader
  body
    block content

我的map.jade看起来像这样:

代码语言:javascript
复制
extends layout
block extraHeader
    link(rel='stylesheet' href='https://unpkg.com/leaflet@1.3.1/dist/leaflet.css')
    script(src='https://unpkg.com/leaflet@1.3.1/dist/leaflet.js')
block content
    h1= title
    h2= count
    #map
    script.
        var locations = !{JSON.stringify(jsonData)};
        // Create variable to hold map element, give initial settings to map
        var map = L.map('map',{ center: [0, 0], zoom: 7});
        // Add OpenStreetMap tile layer to map element
        L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '© OpenStreetMap'
        }).addTo(map);

        // Add JSON to map
        for(var i = 0; i < locations.length; i++) {
            var loc = locations[i];
            L.marker([loc.lat, loc.lng]).addTo(map);
        }

我想包括额外的javascript到地图视图头部的部分,而不是内联脚本,例如

代码语言:javascript
复制
<head>
... ...
<script type="text/javascript">
    // DO SOMETHING
    var foo = 1;
<script>
</head>

有没有办法做到这一点?

编辑:我的package.json看起来像:

代码语言:javascript
复制
{
  "name": "app_name",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "bluebird": "^3.5.1",
    "body-parser": "^1.18.3",
    "cookie-parser": "~1.4.3",
    "debug": "~2.6.9",
    "dotenv": "^5.0.1",
    "express": "~4.16.0",
    "http-errors": "~1.6.2",
    "jade": "~1.11.0",
    "morgan": "~1.9.0",
    "nodemon": "^1.17.5",
    "pg-promise": "^8.4.4"
  }
}
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-06-28 08:01:42

您使用的是哪个版本的Jade?如果您使用的是以前版本的Jade (< 7.0),则可以使用过滤器:javascript

使用最新版本的Jade (Pug),您可以简单地使用script标记,例如:

代码语言:javascript
复制
script(type='text/javascript').
      // Your code here

有关该主题的更多信息,请访问:https://github.com/pugjs/pug

编辑:如果你想将它包含在布局的页眉中,你可以简单地将脚本移动一个块,放在页眉标签中,在你的例子中,将脚本标签移动到extraHeader就可以了。

票数 0
EN

Stack Overflow用户

发布于 2018-06-28 08:09:30

使用后面带点的“script”标记来引入内联Jvascript。

代码语言:javascript
复制
script.
  if (true) {
    alert("this is working")
  }

您可以使用http://html2jade.org/查看从Jade到HTML的实时转换,反之亦然

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51072833

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档