HTML5 PNG 解码测试

基于这篇文章的研究结果，做了一个小实现。
测试入口
不支持IE。。。

几点经验吧：

1. escape和unescape采用Unicode编码，encodeURI(Component)和decodeURI(Component)采用UTF-8编码。
2. Opera不支持HTML5原生拖拽（？）
3. 一旦在源HTML里设置图像宽度，无论是width，还是内置css还是style标签，更新innerHTML之后都会乱码，原因不明。
4. forEach虽然好用，但是只支持数组，nodeList之流还是乖乖for循环。。。
5. Chrome存不了拖拽dataTransfer的setData，刚set完get就没有，而且直接看对象也是只存了key没存value，原因不明。
6. effectAllowed里面，move跟移动文件的光标一样，copy跟复制文件的光标一样，link跟创建快捷方式的光标一样。
7. 如果在dataTransfer里面set了text/plain的data，drop时firefox会自动打开搜索页。就跟选中一段文本拖动是一个感觉。Chrome没有估计是因为5的原因。要防止的话preventDefault可能不是万能的，drop时clearData才是万全之策。
8. Safari的宽度计算有问题？四宫格视图里面，总宽度500，其他浏览器只要每个宽度250就可以放下，Safari必须248，然后拖动一下之后250居然又可以放下了。目测BUG。

其实主要还是想练Python。
头回写Python，上手真的很快。
本来用的Notepad++配合PyNPP插件，结果写完了发现Python自带IDLE。。。
代码编译成PNG的Python脚本如下，用了png库。

codeFileName = "style.css"
pngFileName = "style.png"

import png
codeFile = open(codeFileName, "r")
pngFile = open(pngFileName, "wb")

code = []
line = []
while True:
    c = codeFile.read(1)
	if(len(c) == 0):
		break
	line.append(ord(c))
	if(len(line) == 16 * 3):
		code.append(line)
		line = []
line.append(0xFF);
if len(line) > 0:
	while len(line) < 16 * 3:
		line.append(0)
	code.append(line)

writer = png.Writer(16, len(code), compression = 9)
writer.write(pngFile, code)

codeFile.close()
pngFile.close()