我认为它必须是一个简单的问题，但我一直在寻找并且没有在任何地方找到答案。
我认为我有一个带有一些脚本（在正文中）的html页面，就像这样：
<script type="text/javascript">grf();</script>
grf（）函数在外部.js文件中定义。问题是：一旦浏览器加载了页面及其所有外部js文件，是否执行此功能？或者可能是在加载.js文件之前执行该函数的情况？如果是这样，我该如何防止这种情况？
要查看是否定义了函数：
// functions are defined or undefined just like regular variables
function myFunc() {
/*--code here--*/
}
// So we just need to see if it's defined
if( myFunc ) {
/*--do something here--*/
} else {
/*--wait, retry or w/e--*/
}
当找到外部脚本时，在读取外部脚本之前不会进一步读取（x）html（如果那里有任何可执行代码，则执行内部代码）。
因此，在“包含”外部文件之后调用外部文件中的函数不能生成函数未定义的错误。 （但是，请记住，如果外部函数试图操纵DOM或页面中仍然“不存在”的元素，您将收到错误。）
该函数在遇到时运行。如果要在页面加载后运行它，标准方法是挂钩窗口的onload事件。 jQuery对此有很大的支持，但让我们从地面开始：
<script type="text/javascript">window.onload = function() { grf(); }</script>
这将踩踏任何其他onload处理程序，而不是之前在页面上分配的，这就是为什么大多数人使用jQuery，它小心地链接到以前的处理程序：
<script type="text/javascript">$(document).ready(function() { grf(); });</script>
当然，对于第二个示例，您需要在页面的更上方包含jQuery库（听起来您无法做到这一点）。
当浏览器加载页面时，该方法将在到达<script>块的末尾时执行。如果外部JS文件包含在页面中，而不是调用此方法的位置，则会抛出错误（未定义方法）。
如果要等到页面和资产已加载，最好使用库。使用建议的内置onload事件是有限的，因为它只支持添加一个处理程序（添加另一个将覆盖前一个处理程序）。这是使用jQuery的示例：
<script type="text/javascript">
$(document).ready(function() {
//code goes here
});
</script>
只要脚本文件包含在函数用法之上，该函数就可用。浏览器遇到a时会暂停渲染
<script src="..."></script>
标签。它只会在下载和解析脚本时继续处理文档页面。因此，脚本中定义的任何函数都可以在以下情况下使用：
<script src="..."></script> <!-- Browser waits until this script is loaded -->
<script>
foo(); // if function foo was in the script above, it is ALWAYS available now
</script>
这实际上并不总是理想的行为 - 有时您不希望等待脚本下载，因为它可能会使您的代码看起来很慢。一种技术是在</body>之前加载并执行页面底部的所有脚本，此时所有HTML都已呈现。
浏览器在看到标记时执行它。不仅可能尚未加载其他脚本，也可能无法构造DOM。但是，可以保证脚本按照它们出现在HTML中的顺序执行。
如果你可以使用jQuery，它有$ .ready（）函数，当DOM准备就绪时调用回调，因此每个脚本都已加载。像它一样使用它
$.ready(grf);
或者使用常用的匿名功能。
防止脚本问题的最好方法是使用jQuery，Mootools等JavaScript库，这样可以轻松地将任何代码绑定到各种事件（dom.ready等），以确保事先完全加载所有内容。