2014年7月

javascript 正则表达式 链接

Javascript的正则表达式有2种写法

var re = /ab+c/;                  //(1)
var re = new RegExp("ab+c");      //(2)

第一种写法, 要求写程序的时候, 必须知道正则表达式的值, 也是在脚本被load 到页面的时候编译, 编译后为常量.
第二种写法, 表达式可以为常量, 也可以为变量, 是在运行时编译的.

链接:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions

webp 图片格式

webp 读作[weppy], 是 google 于2010年推出的一种有损压缩格式, 比 png 和 jpeg 大幅减少文件大小, 但是转换过程需要更长时间.
现在只有 chrome 和 opera 浏览器支持这种文件格式, 并且保存到 windows, mac, linux 现在都无法打开, 编辑.

facebook 在2013年开始在网站上使用这种格式, 国内的淘宝上面也在使用这种格式. 这种格式会使客户端和服务器端大大减少网络流量, 因为网站的图片占据了网站的大部分流量.

查看浏览器的支持情况, 查看这里: http://caniuse.com/webp
官方: https://developers.google.com/speed/webp/?csw=1

参考: http://en.wikipedia.org/wiki/WebP

Chrome 插件不受 同源策略的限制, 允许跨站请求

想做一个HTML 元素转化为图片的功能, 可是如果你在自己的网址上做, 图片是可以拿到, 但是一旦放到canvas 里面, 就遭受同源策略的限制. 当然, 我这里只是找到一个 HTML 元素 转 canvas, canvas 再转 图片的方案.

突然发现 chrome的插件不受 同源策略的限制, 欣喜十分.
详细信息, 参看这里: https://developer.chrome.com/apps/xhr

html 元素转成 canvas, 然后在转成图片

这里记录最近研究如何做页面图片处理的一些知识链接:

js 处理图片的类库:
http://www.pixastic.com/lib/docs/

js 转换html 元素为 canvas, 转换为图片的类库:
http://html2canvas.hertzen.com/

有关跨域的处理
https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image

其他:
html, canvas, image
http://www.html5canvastutorials.com/tutorials/html5-canvas-image-size/
html5 canvas API:
http://www.w3schools.com/tags/ref_canvas.asp
html 5 canvas 教程:
http://www.html5canvastutorials.com/advanced/html5-canvas-save-drawing-as-an-image/
jsfiddle 在线例子:
http://jsfiddle.net/Sq7hg/2/
中文关于 CORS的一篇比较好的文章:
http://blog.csdn.net/hfahe/article/details/7730944