## popup popup是点击`browser_action`或者`page_action`图标时打开的一个小窗口网页,焦点离开网页就立即关闭,一般用来做一些临时性的交互。 popup可以包含任意你想要的HTML内容,并且会自适应大小。可以通过`default_popup`字段来指定popup页面,也可以调用`setPopup()`方法。 ``` { "browser_action": { "default_icon": "images/icon19.png", // 图标 "default_title": "Google Mail", // tooltip提示 "default_popup": "popup.html" // 点击图标后展示的气泡框页面(独立页面,可加载js / css) } } ``` default_icon也可以这样: ``` "default_icon": { "16": "images/icon16.png", "24": "images/icon24.png", "32": "images/icon32.png" }, ``` **1. 哈哈大笑** (实例:`popup`): ``` // manifest.json { "browser_action": { "default_title": "TG", "default_icon": "icon.png", "default_popup": "popup.html" } } // popup.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <img style="width: 100px;" src="laugh.jpg" alt=""> </body> </html> ``` 安装完成后,在浏览器右上角可以看到图标: ![](https://box.kancloud.cn/b6f24dd3acd33d8feded494be0940247_183x161.png) 注:popup中可以直接通过`chrome.extension.getBackgroundPage()`获取background的window对象。 **何时使用** 仅针对popup页面内起作用的、比较小的(这样每次重新载入不会太久)脚本 更多关于popup:《改变浏览器的UI界面 -> [Browser Actions](BrowserActions.md) | [Page Actions](PageActions.md)》