绑定到脚本标签的javascript代码的生命周期是什么?

what is the lifecyle of javascript code bound to a script tag

本文关键字:生命 周期 是什么 代码 javascript 脚本 标签 绑定      更新时间:2023-09-26

我对web应用程序比较陌生,目前在开发web应用程序时,我正在学习一些漂亮的新技术和框架。

我最近通过使用jquery.load()在运行时重新加载我的页面的一部分,向一个单页应用程序移动。

到目前为止,我有脚本嵌入在我的部分网页,并使用自定义事件来初始化它们,而不是使用$('document').ready(),这在使用load时不会被触发。

现在我想知道当他们的脚本标签所在的页面的一部分被另一个页面片段取代时,我的javascript代码实际上发生了什么。

显然,脚本标签DOM元素被丢弃,但发生了什么函数,变量,处理程序等?它们是否仍然可用,或者我现在注册的处理程序是否未定义,并在触发它们时抛出异常?

目前我正在看require.js,我想知道这是否会(取决于对上述问题的回答)改变我的脚本的生命周期,因为被require.js加载,它们不绑定到一个DOM元素,很可能被丢弃?

欢呼托马斯。

当浏览器解析<script>标记时,一切都停止,并对代码进行评估。一旦执行开始,<script>标记就无关紧要了——它甚至可以被它所包含的代码删除。如果脚本创建了任何全局变量,它们将保存在全局变量空间中;如果它定义了函数,同上;如果它约束了一些听众,他们就会继续听。删除脚本不会影响全局空间(特别是,它不会倒带时间并擦除脚本执行产生的任何更改)。

像Require.js这样的动态JS加载器是这样做的:通过AJAX获取代码文本,创建一个脚本元素,然后将其插入到文档中,这使得浏览器执行上述操作。唯一的区别是当这种情况发生时:<script>标记暂停一切,直到代码被执行(除非它被defer标记),而Require.js处理每个脚本执行的时间(并给你依赖决议来控制那个时间)。

大多数应用程序最好不要在AJAX页面中加载JS,原因很简单——正如你所发现的那样——AJAX加载的JS不会自动清理自己,而是应用你在主页中加载的JS函数。然而,这并不是一条牢不可破的定律。