我的第一个chrome扩展(1)——读样例,实现时钟
2024-08-24 04:58:45
学习chrome扩展开发:
与网页类似,需要的知识:html,javascript
chrome扩展程序的构成:
manifest.json:对扩展程序的整体描述文件
{
"manifest_version": 2, //manifest_version:默认为2,可不写
//在第2版manifest下chrome出于安全不会运行html内的js代码
"name": "我的时钟",
"version": "1.0",
"description": "我的第一个Chrome扩展",
"icons": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
},
"browser_action": { //指定扩展图标放在chrome工具栏中
"default_icon": {
"19": "images/icon19.png",
"38": "images/icon38.png"
},
"default_title": "我的时钟", //当鼠标悬停时显示的信息
"default_popup": "popup.html" //单击图标时显示页面的文件位置
}
}
//popup.html:
<html>
<head>
<style>
*{
margin: 0;
padding: 0;
}
body {
width: 200px;
height: 100px;
} div {
line-height: 100px;
font-size: 42px;
text-align: center;
}
</style>
</head>
<body>
<div id="clock_div"></div>
<script src="js/my_clock.js"></script>
</body>
</html>
body中定义了一个id为clock_div的div容器显示当前时间
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);
结果:
remaining problem:
1.在manifest中调用一个js脚本,从而使鼠标移动到按钮上就显示时间,是否可行?
2.如何改变显示字体?
最新文章
- linux通过端口号查找程序执行路径
- Could not create the view: An unexpected exception was thrown 【转】
- SVN——配置和安装
- http://www.miniui.com/demo/#src=datagrid/celledit.html
- [NOIP2011] mayan游戏(搜索+剪枝)
- 【好用的小技巧】win8兼容、网页不让复制
- 使用 Team Foundation 版本控制命令
- 【Heritrix基础教程之4】开始一个爬虫抓取的全流程代码分析
- Jcompress: 一款基于huffman编码和最小堆的压缩、解压缩小程序
- 第一天上午——HTML网页基础知识以及相关内容
- C#内存管理解析
- 如何动态修改网页的标题(title)?
- JavaScript异步编程:Generator与Async
- 实验楼-Git实战教程
- HDU-1002.大数相加(字符串模拟)
- IEngineEditor接口的0x80004003错误
- sql批量修改wordpress网站的文章发布状态
- Dapper Extensions中修改Dialect
- ThinkPHP CURD mysql操作
- winfrom 右下角弹窗(渐渐消失)
热门文章
- AsyncTask下载JSON
- Professional Android Application Development
- 阿里云SDK手册之java SDK
- 最大子矩阵和 URAL 1146 Maximum Sum
- BZOJ2062 : 素颜2(face2)
- HDU1853 &; 蜜汁建图+KM模板
- 【POJ】1743 Musical Theme
- POJ 3071 Football(概率DP)
- android DDMS 连接真机(己ROOT),用file explore看不到data/data文件夹的解决办法
- iOS开发之正则表达式