javascript 页面加载后执行Javascript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8418517/
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
Executing Javascript after page has loaded
提问by user489041
I am new to JavaScript and having a slight issue figuring out when events fire. Here is the situation. I am writing an ASP.Net application. In my code behind, in the Page_Load() I have some code. I need this code to execute first. After this code has finished executing, then I need my JavaScript to execute.
我是 JavaScript 的新手，在确定事件何时触发时遇到了一些小问题。这是情况。我正在编写一个 ASP.Net 应用程序。在我后面的代码中，在 Page_Load() 我有一些代码。我需要先执行这段代码。这段代码执行完毕后，我需要我的 JavaScript 来执行。
Is there an event or something that exists that insures the code will execute in that order?
是否存在确保代码按该顺序执行的事件或其他事物？
回答by Adam Rackis
The simplest way would be to add your function call to your body's onload event
最简单的方法是将您的函数调用添加到您的身体的 onload 事件
<body onload="yourFunction()">
function yourFunction() {
}
Alternatively, you could also place some script at the very endof your body. Any script in here will be executed after the body is processed. You'll be able to do things like
或者，您也可以在身体的最后放置一些脚本。处理完正文后，将执行此处的任何脚本。你将能够做这样的事情
var divElement = document.getElementById("divId");
without it coming back as null.
没有它作为空返回。
EDIT
编辑
I didn't see jQuery tagged on your question, but, if you happen to be using it, you can also do this:
我没有看到 jQuery 标记在你的问题上，但是，如果你碰巧正在使用它，你也可以这样做：
$(document).ready(function() {
//dom is ready
});
or more simply:
或更简单地说：
$(function() {
//dom is ready
});
回答by Matt Esch
Scripts included on the body execute when the body has loaded and they execute in order. This can be used as a cross-browser solution for ensuring scripts get loaded after the page has loaded.
包含在正文中的脚本在正文加载时执行并按顺序执行。这可以用作跨浏览器解决方案，以确保在页面加载后加载脚本。
<!DOCTYPE html>
<html>
<head>
<!-- scripts loaded in unknown order in some browsers -->
<script type="text/javascript" src="headscript.js"></script>
</head>
<body>
<!-- scripts included on body execute in order when the DOM is ready -->
<script type="text/javascript">
(function () {
// do what you want here without trashing global scope
// you should probably include this as an external script
}());
</script>
</body>
</html>
回答by Elias Hossain
Yes, there are several ways to go:
是的，有几种方法：
a.
一个。
$(window).ready(function()
{
//Your code goes here
});
b.
湾
$(document).ready(function()
{
//Your code goes here
});
c.
C。
window.onload = function()
{
//Your code goes here
}
回答by El Ronnoco
I think you may have a slight confusion around the lifecycle of an ASP page.
我认为您可能对 ASP 页面的生命周期略有困惑。
All the events in the server-side (VB / C#) code will fire (except maybe for user triggered events) every time the page is built. So Init, Load, PreRender, Render, Unload etc... Only after the page has been built is it sent down the wire to the browser. Once the browser has hold of it thenyour JavaScript may be executed.
每次构建页面时，服务器端（VB/C#）代码中的所有事件都会触发（用户触发的事件除外）。因此，Init、Load、PreRender、Render、Unload 等……只有在页面构建完成后，它才会通过线路发送到浏览器。一旦浏览器掌握了它，那么您的 JavaScript 就可能被执行。
The way Adam suggests is one possible way of doing this.
亚当建议的方式是这样做的一种可能方式。
回答by Jeffrey Sweeney
Fret not, server-side scripts will always execute before client sided ones.
不用担心，服务器端脚本将始终在客户端脚本之前执行。
To ensure that the Javascript executes after everything on the page (DOMContent-wise) has been created, you have several options. You can add the script to the very bottom of the tag. This is actually good practice, as a script at the bottom of the page makes the page seem to load faster, and perceived performance is important.
为确保在页面上的所有内容（DOMContent-wise）创建后 Javascript 执行，您有多种选择。您可以将脚本添加到标签的最底部。这实际上是一种很好的做法，因为页面底部的脚本使页面看起来加载速度更快，并且感知性能很重要。
As Adam said, you can also use event handlers, such as window.onload = function(){} or window.addEventListener("load", function(){}, true). An alternative is to use "DOMContentLoaded" instead of "load", which will execute once the entire text portion of the html file loads (as opposed to waiting for all the images, etc. to load). If you put the script at the bottom of the page however, this will be unnecessary.
正如 Adam 所说，您还可以使用事件处理程序，例如 window.onload = function(){} 或 window.addEventListener("load", function(){}, true)。另一种方法是使用“DOMContentLoaded”而不是“load”，它将在 html 文件的整个文本部分加载后执行（而不是等待所有图像等加载）。但是，如果您将脚本放在页面底部，则这将是不必要的。
Here's an example html file. Notice the stylesheet is defined at the top, while the script is defined at the bottom.
这是一个示例 html 文件。注意样式表定义在顶部，而脚本定义在底部。
<!DOCTYPE html>
<html>
<head>
<title></title>
<link type="text/css" href="style.css" rel="stylesheet"/>
</head>
<body>
<script type="text/Javascript" src="script.js"></script>
</body>
</html>
