Chrome扩展content script中如何判断当前是否为顶层框架？

当你的Chrome扩展通过manifest.json配置了"all_frames": true导致脚本注入到所有子框架时，无需额外添加"all_frames": false的注入配置，只需在注入的JS代码中通过以下方式判断当前框架是否为顶层框架：

• 核心判断逻辑：通过比较当前框架的window.self与顶层窗口的window.top是否相等来识别顶层框架。

代码示例 #

// 仅在顶层框架执行的逻辑
if (window.self === window.top) {
  // 这里编写你需要在顶层框架执行的操作
  console.log("当前为顶层框架，执行业务逻辑");
  // 比如DOM操作、发送消息给后台脚本等
}

原理说明 #

• window.top：始终指向页面的顶层浏览器窗口，无论当前代码在多少层嵌套的iframe中。
• window.self：指向当前框架自身的window对象。
• 当两者引用相等时，说明当前代码运行在顶层框架中；若为子框架，window.self会指向子框架的window，而window.top仍指向顶层，此时两者不相等，代码会跳过顶层专属逻辑。

这种方法无需修改扩展的注入配置，直接在现有脚本中添加判断即可实现需求，避免了重复注入脚本的冗余。

内容的提问来源于stack exchange，提问作者SantK