脚本在/body之前，但是在页面加载之前运行 [英] Script is before /body but it runs before page is loaded
问题描述
我是Web开发的新手，我正在尝试Express的node.js.
I am new to web developing and I am trying node.js with express.
我具有以下目录结构:
第一个应用
---- node_modules
---- 公开
-------- 脚本
------------ additems.js
---- 视图
-------- home.ejs
---- app.js
带粗体的是文件夹，斜体是文件.
with bold is a folder and italic is a file.
这是文件additem.js:
this is the file additem.js:
console.log("js connected");
alert("test");
这是home.ejs文件:
and this is home.ejs file:
<!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">
<title>Test Node</title>
</head>
<body>
<h1>Dynamic Page</h1>
<p></p>
<ol id='olist'>Names List</ol>
<script type="text/javascript" src="../public/scripts/additems.js"></script>
</body>
</html>
这是app.js文件:
And this is the app.js file:
var express = require('express');
var app = express();
console.log("Server has been started!");
//app.use(express.static(__dirname + "/public"));
app.get("/", function(req,res){
//res.send("Home Page");
res.render("home.ejs");
})
页面加载前正在运行javascript的问题
我知道这一点，因为警报消息先于其他消息出现.另外，我尝试使用一些DOM元素，但是它们已作为未定义返回.
I know this because the alert message is appearing before anything else. In addition I tried to use some DOM elements but they have been returned as undefined.
搜索网络后，我可以看到我的脚本位置在标记之前是正确的，并且应该在最后运行.
Searching the net I can see that my script position is correct just before the tag, and supposedly it should run last.
我在这里想念什么?
我知道可能会使用onload事件，但除非有必要，否则我想避免它，除了我想了解为什么脚本最终没有按预期运行./strong>
I am aware of the possibility of using the onload event, but I want to avoid it unless it is a must, beside I want to learn why the script is not run at last as it supposed to do.
更新-已解决
感谢斯科特·马库斯(Scott Marcus)的贡献，这有助于我解决了问题.
Thanks Scott Marcus for your contribution which helped me solving the problem.
实际上，有一个双重错误.
In fact, there was a double error.
1-我使用了alert()，但这不能像您提到的那样提示.
2-我没有在alert()之后提及代码，因为我从一个受信任的网站复制了该代码，并且我希望问题尽可能短.但是，该代码有一个错误，导致它无法以正确的方式运行.
1- I used alert() and that is cannot be a hint as you mentioned.
2- I did not mention the code after the alert() because I copied it from a trusted website and I wanted the question to be as short as possible. However, the code had an error that prevented it from being run in the correct way.
谢谢.
推荐答案
页面加载前正在运行javascript的问题
我知道这是因为警报消息出现在任何东西之前其他.
I know this because the alert message is appearing before anything else.
不能因为得出这个结论而受到指责，但实际上并非如此.
alert()由操作系统与产生它们的JavaScript异步处理，通常可以比JavaScript执行更快的速度呈现.另外， alert()是一个阻止" API调用，它冻结UI，以使渲染与处理不同步.
alert()'s are processed by the operating system asynchronously from the JavaScript that spawned them and can usually be rendered faster than the JavaScript can execute. Additionally, an alert() is a "blocking" API call, it freezes the UI so that rendering doesn't sync up with processing.
使用 console.log()代替 alert().您会发现这样做表明您的代码在适当的时候运行.
Instead of an alert() use a console.log(). You will find that doing so shows that your code is running when it should.
这是一个 alert()如何误导您对序列流的解释的示例.
Here's an example of how an alert() can mislead your interpretation of the flow of a sequence.
console.clear();
console.log("test before alert()");
alert("Look at the console. Notice how you don't see the log message that came before me?\nEven though the JavaScript received the instruction to write to the console, the OS can render an alert() faster than that.");这又是相同的概念，但是这次没有将任何工作转移到OS:
Here's the same concept again, but this time without offloading any work to the OS:
console.clear();
console.log("test before console.log()");
console.log("Look at the console. Notice how you now do see the log message that came before me?");这篇关于脚本在/body之前，但是在页面加载之前运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
