javascript Jade:加载外部javascript和调用函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26702006/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 06:21:00  来源:igfitidea点击:

Jade: load external javascript and call function

javascriptnode.jsexpresspug

提问by CocoHot

I was learning Express/Node/Jade and now in the Jade file I want to include a javascript file from the public folder just for the page. For example, in jade file I type this:

我正在学习 Express/Node/Jade,现在在 Jade 文件中,我想从公共文件夹中为页面包含一个 javascript 文件。例如,在玉文件中,我输入:

script(src='/javascripts/test.js')

and inside test.js I have a function

在 test.js 里面我有一个函数

function check_test(){
    return "It's working!"
}

then I try to call the function in Jade by

然后我尝试通过调用 Jade 中的函数

- var test_response = check_test()

than I got the error saying that "undefined is not a function" and test.js isn't load at all. Apparently Jade doesn't load the file, they only transform into HTML code.

比我收到的错误消息说“未定义不是函数”并且 test.js 根本没有加载。显然 Jade 不会加载文件,它们只会转换为 HTML 代码。

I look someone else's question and this is the closest one I can found but it doesn't provide a clear answer of what to do. In Jade, how can you call a function in an external Javascript

我看了别人的问题,这是我能找到的最接近的问题,但它没有提供明确的答案。 在 Jade 中,如何调用外部 Javascript 中的函数

So my question is: In this case what should I do to make it work?

所以我的问题是:在这种情况下,我应该怎么做才能让它发挥作用?

I don't want to load the file in layout.js since I only want test.js only be use by this page.

我不想在 layout.js 中加载文件,因为我只希望 test.js 只被这个页面使用。

采纳答案by Alejo Next

Well... In the first instance, it is different what happens in the browser of what happens on the server. So Jade is a rendering of HTML, therefore if you are in the browser. It's what ExpressJS shipping, ie rendering Jade. If you want to call, your HTML Javascript (Rendering of Jade), should show you where the Javascript. For exmaple

嗯...首先,浏览器中发生的事情与服务器上发生的事情不同。因此 Jade 是 HTML 的渲染,因此如果您在浏览器中。这就是 ExpressJS 运送的东西,即渲染 Jade。如果你想调用,你的 HTML Javascript (Rendering of Jade),应该显示你的 Javascript 在哪里。例如

in Server.js

在 Server.js 中

// Get the Javascript in the browser
app.use("/javascripts", express.static("./outJavascripts"));
// Get the URL
app.all("/", function(req, res){
  // Render the Jade and Send for the client (Browser)
  req.render("myTemplate.jade");
});

In myTemplate.jade

在 myTemplate.jade 中

script(src='/javascripts/test.js')

In "./outJavascripts/test.js"

在“./outJavascripts/test.js”中

function check_test(){
    console.log("It's working! :D");
    return "It's working!";
}

If you do this, you will realize that it is run, the file "./outJavascripts/test.js" in the browser. And the function "check_test" never run in the server.

如果你这样做,你会发现它运行了,浏览器中的文件“./outJavascripts/test.js”。并且函数“check_test”永远不会在服务器中运行。

回答by DarkMukke

Or put all folders in a common folder, for example public

或者将所有文件夹放在一个公用文件夹中,例如 public

public -javascripts -stylesheets -images

public -javascripts -stylesheets -images

and then expose that public folder

然后公开该公用文件夹

app.use(express.static(path.join(__dirname, 'public')));

app.use(express.static(path.join(__dirname, 'public')));

which means you can

这意味着你可以

script(src='/javascripts/script.js') link(rel='stylesheet', href='/stylesheets/style.css')

script(src='/javascripts/script.js') link(rel='stylesheet', href='/stylesheets/style.css')

回答by Dean Hu

Save your JS file and link it in your Jade file as:

保存您的 JS 文件并将其链接到您的 Jade 文件中:

script(src="filepath/yourJSfile.js")

Then call the function, I'm using a button here for example:

然后调用该函数,例如我在这里使用一个按钮:

button(class="btn", onclick='functionName()')