几乎所有简单的javascript示例都显示类似
的代码<script>
window.alert('sup');
</script>
这并没有明确说明浏览器何时应该执行脚本。但是,代码确实似乎在某些时候运行...我觉得它可能是窗口/文档onload事件之一,但我似乎无法找到指定此行为的位置(或者即使它已指定)。 ...我想,如果是后者,是否存在记录这些非指定浏览器行为的资源,或者是可用的最佳解决方案?
答案 0 :(得分:3)
如果您不在script
元素上使用async
or defer
attributes,则浏览器会在解析文档时运行不在函数内部的JavaScript代码。如果有多个脚本元素,则按顺序运行它们。
如果函数是直接调用的,那么函数内的 的代码仍然可以在没有触发它的特定事件的情况下运行,例如以下将定义一个函数,然后立即调用它:
<script>
function test() {
alert("Test");
}
test();
</script>
按顺序执行脚本元素是浏览器的一个重要的,可预测的行为,因为如果文档中间的脚本元素恰好执行document.write()
之类的操作,则写入的任何内容都将出现在脚本元素的位置是。如果脚本试图操纵文档中的其他元素,那么它只能访问上面的元素脚本,因为下面的元素尚未被解析。此外,任何给定脚本中的JS都可以访问在早期脚本元素中声明的全局函数和变量。
“我觉得它可能是窗口/文档onload事件之一”
不是。这些事件将调用显式绑定到它们的函数(如果有的话)。您在问题中显示的其他代码以及上面显示的代码将在 onload事件之前运行。
async
和defer
属性会在支持它们的浏览器上发生一些变化。它们仅与引用外部JavaScript资源的script
标记相关,例如:
<script async src="my.js"></script>
对这个答案的完整讨论是偏离主题的,但是:
async
或defer
将允许HTML解析器继续构建页面,而无需等待首先运行JavaScript代码async
的脚本可能会无序执行,并在可用时立即运行defer
的脚本script
标记上使用它们;如果你这样做,async
获胜