学习《Chrome扩展及应用开发》第一个简单的chrome扩展

目录结构

+ demo1-Clock  + images    - icon128.png    - icon48.png    - icon16.png    - icon38.png    - icon16.png  + js    - my_clock.js  - manifest.json  - popup.html

清单文件 manifest.json

{    "manifest_version" : 2,    "name" : "小小时钟",    "version" : "0.1",    "description" : "demo1 - chrome时钟扩展",    "icons" : {        "16" : "images/icon16.png",        "48" : "images/icon48.png",        "128" : "images/icon128.png"    },    "browser_action" : {        "default_icon" : {            "19" : "images/icon19.png",            "38" : "images/icon38.png"        },        "default_title" : "小小时钟",        "default_popup" : "popup.html"    }  }

页面 popup.html

时间脚本 my_clock.js

function my_clock(el){    var today = new Date();    var h = today.getHours();    var m = today.getMinutes();    var s = today.getSeconds();    m = m >= 10 ? m : ('0' + m);    s = s >= 10 ? s : ('0' + s);    el.innerHTML = h + ":" + m + ":" + s;    setTimeout(function(){ my_clock(el); }, 1000);}var clock_div = document.getElementById('clock_div');my_clock( clock_div );

加载即用

• 打开chrome浏览器扩展程序界面，点开开发者模式，选择加载已解压的扩展程序