用Bookmarklet创建Web安全颜色表格
最近在看 JavaScript 的一些基础知识,其中包括 bookmarklet 的相关资料。用 bookmarklet 创建 web 安全颜色表格是 bookmarklet 的一个应用,而且在以后的 web 配色中也可以当作参考。先解释两个概念吧。
什么是 Bookmarklet?
Bookmarklet 是在浏览器中的一种特殊的书签,或者用 IE 的叫法—“收藏夹”。一般的书签都是调用外部 URL,而它不同,它是对浏览器的 JavaScript 解释器的调用,执行指定的 JavaScript 程序。使用 bookmarklet 可以实现很多有用、有趣的功能,使浏览器成为更好用的工具。
Bookmarklet 的格式为 javascript:[code],即一个 JavaScript 伪协议限定符 + JavaScript 代码。最简单的例子当然还是 Hello World:
javascript:alert ('Hello World!');
一般来说,bookmarklet 都放在页面的 <a> 标签中,例如 <a href="javascript:alert ('Hello World!');">Hello World</a> (Hello World)。一些有用的 bookmarklet 可以放在浏览器的书签中,新建书签的时候把 <a> 标签的 href 属性值塞进书签的地址中就可以了。
什么是 Web 安全颜色?
在远古时代,很多显示器都只支持256种颜色。除去 Windows 和 Mac 操作系统的40种保留颜色,还剩下216种颜色,它们是可以保证能够被正确显示的颜色,这216种颜色就叫 Web 安全颜色。
尽管现在显示器已经可以显示数百万种颜色,但是这216种 Web 安全颜色仍然是最经典的颜色,能保证所有的计算机在256色下运行时能够正确显示。
代码
用 bookmarklet 创建 web 安全颜色表格的代码如下:
var i,j,k,l,t='<table width=800px>',c=new Array('00','33','66','99','CC','FF');
for(i=0;i<6;i++){
for(j=0;j<6;j++){
t+='<tr>';
for(k=0;k<6;k++){
l=c[i]+c[j]+c[k];
t+= j<3?
'<td height=30px bgcolor=#'+l+'><font color=white>#'+l+'</font></td>':
'<td height=30px bgcolor=#'+l+'>#'+l+'</td>'
}
t+='</tr>'
}
}
void(document.body.innerHTML=t+'</table>')
点击这里看演示(有点不爽的是不能通过后退回到上一个页面,只能刷新)
考虑到简便,以上的代码使用了很多 bgcolor、font 等非法的属性和标签,不符合 XHTML 标准。不过写页面 XHTML 代码的时候可不能这样哦,呵呵。
想法不错,有创意
[回复]
呃,事实上,这不是我的想法,是在一本书上看到的
[回复]