2024年12月

JavaScript 页面加载与卸载相关事件

适用范围事件触发时机适用场景特性/注意点
windowload页面所有资源（HTML、图片、样式等）加载完成需要确保所有资源加载后再执行逻辑比 DOMContentLoaded 晚，等待资源加载
beforeunload页面即将卸载时（导航到新页面或关闭标签）提示用户保存数据或防止意外离开可显示离开确认对话框，设置 event.returnValue
unload页面完全卸载时（文档和资源从内存中清除）清理资源（如 WebSocket 连接、定时器等）现代浏览器限制较多，无法异步执行逻辑
focus/blur页面获得或失去焦点时触发检测用户切换到其他窗口或标签页可结合 document.hidden 检测可见性变化
documentDOMContentLoadedHTML 完全解析完成，资源（图片、样式表等）未必加载完成操作 DOM 元素，不依赖资源加载比 load 更早触发，常用于脚本初始化
readystatechangedocument.readyState 改变时触发，包括 loading、interactive、complete监控页面加载状态适合实时监控文档解析和加载的不同阶段
visibilitychange页面的可见性状态改变（如切换标签、最小化窗口）检测页面切换状态，节省资源或暂停功能状态通过 document.hidden 或 visibilityState 获取
Chrome 插件 Content Scriptrun_at: "document_start"页面开始加载时（HTML 解析前）插入代码以修改页面的初始状态不适合操作 DOM，适合拦截初始 HTML
run_at: "document_end"HTML 完全解析完成（等同于 DOMContentLoaded）操作已解析的 DOM，初始化插件逻辑脚本逻辑不会等待资源加载
run_at: "document_idle"HTML 解析完成，大部分资源已加载（页面处于空闲时运行）插件的默认运行时机，适用于大部分场景保证 DOM 和大部分资源已准备好
window 或特定元素error资源加载失败时（如图片、脚本、样式表）捕获资源加载错误或执行失败的脚本可在 window 或特定元素（如图片）上监听

import sys
from pathlib import Path

# 设置一个跨平台的统一路径
def get_playwright_browsers_path():
    # 获取用户主目录

    home_dir = Path.home()

    # 在主目录下创建一个固定的 Playwright 浏览器路径
    playwright_path = home_dir / ".playwright_browsers"

    # 确保路径存在
    playwright_path.mkdir(parents=True, exist_ok=True)

    return str(playwright_path)

# 动态设置浏览器路径
os.environ["PLAYWRIGHT_BROWSERS_PATH"] = get_playwright_browsers_path()

def ensure_browser_installed():
    try:
        from playwright.__main__ import main as playwright_main
        playwright_main()  # 自动安装 Chromium
    except Exception as e:
        print(f"Error during Playwright installation: {e}")
if __name__ == "__main__":
    # check args
    args = sys.argv
    if len(args)>1 and args[1] == 'install':
        ensure_browser_installed()
    app = QApplication(sys.argv)
    main_window = URLFetcherApp()
    main_window.show()
    sys.exit(app.exec_())

打包之后运行

main.exe install

pre {
      white-space: pre-wrap; /* 保留格式并自动换行 */
      word-wrap: break-word; /* IE 浏览器兼容 */
      overflow-wrap: break-word; /* 现代浏览器兼容 */
      border: 1px solid #ccc; /* 添加边框便于观察 */
      padding: 10px;
    }
  1. 1
  2. 2
  3. 3