以下是一个简单的Chrome扩展程序开发的例子:
创建一个新的文件夹并命名为"Chrome-Extension",并添加manifest.json文件,这个叫格式清单文件,在文件中添加扩展程序的基本配置信息:
{"manifest_version": 2,"name": "My Extension","description": "A simple Chrome extension","version": "1.0","icons": {"128": "icon128.png"},"browser_action": {"default_icon": "icon.png","default_popup": "popup.html"}}
该配置文件指定扩展程序的名称、描述、版本、图标和浏览器操作等信息。
具体还有其他配置内容请参阅官方文档 /extensions/manifest
创建popup.html文件作为扩展程序的前台页面,包含一个简单的按钮:
<!DOCTYPE html><html><head><title>My Extension</title><script src="popup.js"></script></head><body><button id="myBtn">Click me!</button></body></html>
该页面包含一个按钮和一个JavaScript文件。
创建popup.js文件,定义按钮的点击事件:
document.getElementById("myBtn").addEventListener("click", function() {alert("Hello World!");});
该文件定义一个点击事件,当用户点击按钮时,将弹出一个欢迎提示框。
创建icon.png和icon128.png文件作为扩展程序的图标,需要对应manifest.json文件内提到的两个icon文件,这两个文件可以是PNG或JPG格式。
在Chrome浏览器中打开扩展程序管理页面chrome://extensions/
,启用开发者模式,点击"加载已解压的扩展程序"按钮,选择"Chrome-Extension"文件夹,即可在浏览器中安装和调试扩展程序。
最后,将扩展程序发布到Chrome Web Store进行审核和发布。这方面还未进行实测试验。据闻:对于简单的扩展程序,只需将文件夹内容打包为.zip格式,然后将其上传到Web Store即可。审核通过后,用户可以在Chrome浏览器的应用商店中搜索并安装该扩展程序。