文档生命周期事件

2024-07-06 23:14:45

文档生命周期事件

在窗口构造阶段，Sciter引擎执行以下操作：

创建具有未确定尺寸的窗口（HWND）；
加载文档：

解析文档；
加载样式；
加载JS，这也会运行零级代码（变量、函数等的初始化）；
根据CSS声明分配脚本行为；
运行document.ready，在这里如果知道窗口尺寸，可以使用window.move(x,y,w,h)。

步骤：

设置窗口尺寸：如果之前在脚本中没有设置，则从根元素<html>的属性中获取。
触发ready事件（document.on("ready", function() {})）。注意：此时窗口尺寸已知，可以使用window.move(x,y)。
Sciter中的所有<script>元素在文档解析后执行。就像浏览器中定义了“defer”属性：<script defer>。

任何<script>元素都可以在加载时直接执行代码和/或包含事件处理程序，因此：

<script>

// 这里的代码在DOM加载后作为第一步执行...
// 同步，在SciterLoadFile()调用内部执行

document.ready = function() {
    // 代码作为第二步在DOM加载和原型/方面分配后执行...
    // 同步调用，在SciterLoadFile()内部执行。
    // 所有由CSS原型和方面声明的组件都已实例化 - 它们的componentDidMount被调用
    // 但窗口仍处于构造阶段（例如尺寸未知）
}

document.on("ready", function() {
    // **已发布**的事件处理程序作为第三步执行
    // 异步，在SciterLoadFile()调用**之后**执行
    // 此时窗口可能已经可见
});

// 或者：
document.on("DOMContentLoaded", function() {
    // **已发布**的事件处理程序作为第三步执行
    // 异步，在SciterLoadFile()调用**之后**执行
    // 此时窗口可能已经可见
});
</script>

在卸载过程中，会按以下顺序触发事件：

const UNLOAD_BY_CHROME = 0; // 用户点击窗口上的关闭按钮
const UNLOAD_BY_CODE = 1;   // 执行window.close()
const UNLOAD_BY_LOAD = 2;   // 文档卸载旧的/加载新的

document.on("closerequest", function(evt){
  // 调用此函数
  if(evt.reason == UNLOAD_BY_CHROME)
    evt.preventDefault(); // 如果需要在用户点击X时阻止文档卸载
  // 在根文档上，这也会阻止窗口关闭。
});

document.on("beforeunload", function(evt){
  // 不可取消的事件。
  // 文档即将卸载，此时文档脚本命名空间仍然有效并且可操作。
})

frame.on("close", function(evt){
  // 不可取消的事件。
  // 文档几乎已经消失。处理此事件在文档容器上更有意义：<frame>或窗口。
})