易栈网-膘叔

其实这很正常，也不意外，这么久了。。。也该正式版了
不过，jQueryMobile里我想找那个DoubleTap事件也没有好好找到。可能是我没有仔细关注吧？
然后一些clientX移动的事件，也不是特别的爽。。。
OK，去官网看看吧，http://jquerymobile.com
官方说这次正式版的性能提高了很多，在这里有一张图片：http://jquerymobile.com/blog/2011/11/16/announcing-jquery-mobile-1-0/
demo其实也能看，不过要好效果的话，还是建议使用webkit核心的浏览器：Demos & Documentation

今天在为ipad上的一个图片加上点击效果，在safari浏览器里一切正常，但到了ipad上，点击效果就死活出不来。
折腾了很久我才发现，我原来的触发的一个效果是写在a标签上的，也就是说，它是一个链接，然后onclick效果就起作用了。
于是我CreateElement了一个a，为它加上了onclick效果，果然，起作用了。。

------------
事实上很多人都和我说，div是有onclick事件的，嗯，我用Safari也测试确实有，但就是在ipad上无法实现。好吧。我承认我烂，可能是。。。。
可是我都一一在代码中测试了。
附上我那恶心至极的代码 （这是其中的一段，纯备份了）：

阿强说，是因为div没有宽度和高度，我说是100%,他说100％的话就是0。
好吧，我不是前端，我开始的时候没明白，但我没有时间来处理，我也没有空设定固定宽度，因为要考虑横竖屏。。所以先用临时方法替代了。

很明显，这段内容是ctrl+c,ctrl+v而来的，做备份和资料查询用，挺好的。
原文来自：http://www.chencheng.org/blog/2008/10/25/f2e-manual/#f2e-manual-s1

快捷导航：

• 在线工具集
• 常用Firefox插件
• IE下的调试工具
• 参考手册
• 批处理工具
• IDE及其他工具
• Bookmarklet
• 前端开发者社区及权威网站
• 推荐订阅的博客和网站

另外还搞了个Firefox插件《前端开发工具集》，把资源整合到一个菜单下，方便查询。数据放在线上(Google AppEngine)，速度应该会有保证，更新也会比较方便。

在线工具集

• 书籍类：
  • Book Shelf 2.0 beta —— 荐，分类很清晰，下载很方便
  • Book Go!
  • 原版图书免费下载链接收集站
  • 51CNNET.NET
• JavaScript类：
  • Beautify JavaScript —— JavaScript格式化工具，效果很理想
  • AJAX Libraries API
  • Regex Tester
  • Compressor Packer —— 以前一直用这个压JS，自从有了TBCompressor，就放弃他了
• CSS类：
  • CSS选择器性能测试
  • CSSTidy —— CSS格式化工具
  • CSS Compressor —— CSS压缩
• 其他：
  • GUID 生成器 —— 做某些东西(Firefox插件)时需要唯一资源标志符时用
  • W3Counter
  • WebWait – Benchmark Your Website

常用Firefox插件

• 支付宝安全控件 和 旺旺协议 —— 网购专用，Firefox+浦发网银，无敌了
• Firebug —— 这个不用介绍了吧，附空帏的外部编辑器乱码修正版
  • Firecooike —— 支持Cookie的查看和编辑
  • Jiffy —— 调试性能的，用起来比较麻烦，没试过
  • YSlow —— Why Slow? YUI出品
  • Pixel Perfect —— 把设计稿直接拖到Firefox里进行对比
  • Rainbow for Firebug —— JS高亮，性能不是很理想
• Fiddler 开关 —— 简化在Firefox里切换Fiddler的操作，感谢Taobao UED的空帏同学
• Web Developer
• DevBoi —— 把Html, Dom, JavaScript等手册放在侧栏里，可以自定义增加，快捷键Ctrl+F9。可以在这里找到更多的Package。
• RefControl —— 针对每个站点发送想要的HTTP Referer
• GreaseMonkey —— 看某个网站不爽，写个小脚本来优化下还是不错的
• HttpFox —— 查看当前Http链接状态，类似IE下的HttpWatch
• User Agent Switcher —— 切换User-Agent，同时开发iphone和web版本的时候很方便
• FoxyProxy —— 穿墙工具，配合专业代理公布器使用很和谐

IE下的调试工具

• Fiddle2 —— 非常强悍的一款http流查看工具，默认支持IE，其他浏览器可以设置将{Document}\Scripts\BrowserPAC.js设为代理进行使用。Firefox下可用上述”Fiddler 开关”进行快速切换。支持插件。
• IE Developer Toolbar —— 查看元素、禁用缓存、禁用CSS\JS、Outline元素、查看生成的源码等功能，IE8自带了一个加强版的。
• Microsoft Script Debugger + Companion.JS —— 调试JS用，虽然报错还是有误差，但是我已经满足了。安装顺序是：Microsoft Script Debugger，Companion.JS，在”IE选项-高级”里取消禁用脚本调试。
• 多版本IE共存两种方案：
  • IE7/8 + IE Tester —— 大众型配置，可以基本满足日常需要。
  • IE6 + Internet Explorer Collection —— 在IE 6用户占绝对优势以及IE 6神奇bug满天飞的时代，我还是推荐这种方案，因为只有神奇的原装IE 6，才能抵挡运营神奇的问题。另外如果还有其他机器可供支配的话，建议再装个IE 8 + IE Tester，因为IE 8下的Developer Toolbar还是有很大改进的，调试起来会方便一些。
• 以下三个软件相对不重要些：
  • HttpWatch —— http流查看
  • Instant Source —— 可查看JS生成的源码
  • NetLimiterPro —— 网速限制

参考手册

• XHTML、CSS & DOM W3C 手册 —— 玉伯整理的版本，包含了W3C手册以及其他有用的资料。
• 苏昱的CSS中文手册和Dom中文手册
• JScript语言参考
• XML指南
• XMLHTTP参考手册
• jQuery 1.2.6 API和jQuery and jQuery UI Reference 1.2
• Apache 2.2 中文版参考手册在线版
• MySQL 5.1 参考手册 (在线版)
• PHP手册
• YUI Cheatsheet
• Cheat Sheet Roundup – Over 30 Cheatsheets for developers
• 23个Cheatsheet打包下载

批处理工具

• TBCompressor —— 淘宝UED的JS/CSS压缩工具，详见玉伯的介绍
• pngOptimizer —— png优化工具
• jpegTran —— jpeg去冗余meta工具

IDE及其他工具

• Editplus v301 汉化版
• Tortoise SVN
• 移动版本的 Apache + PHP —— 灰常灰常好用，灰常灰常移动，见明城的说明
• …

Bookmarklet(右键另存)

• Firebug Lite —— 官方介绍
• Xray —— 官方介绍
• MRI —— 官方介绍
• ‘+ window.document.documentElement.outerHTML+ ””>查看生成的源码，‘+ window.document.documentElement.outerHTML+ ”);})()”>打开新窗口查看生成的源码 —— for IE

开发者社区及权威网站

• Mozilla Developer Center (MDC)
• YAHOO! Developer Network (YDN)
• Dev.Opera
• Apple Developer Connection
• MSDN
• IBM Developers中国 (Web 前端开发技术专题)
• WebKit
• AOL Developer Network
• SlideShare – Share PPT —— 在线PPT分享，资源丰富
• Google Doctype —— Web开发人员的百科全书
• W3C (香港，中国)
• Position Is Everything
• HTML Dog
• 维基百科

推荐订阅的博客和网站(排名不分先后)

• 国外
  • 内容聚合：A List Apart，Ajaxian，Smashing Magazine，456 berea street，Script & Style，CSS Globe，CSS-Tricks，SitePoint
  • 团队Blog：Yahoo! User Interface Library (YUI)，IEBlog
  • 个人Blog：John Resig，PPK: QuirksMode，Douglas Crockford，Dean Edwards，Nate Koechley，Julien Lecomte，Eric A. Meyer，Andy Budd，Steven Levithan，HedgerWow
• 国内
  • 内容聚合：Blueidea，无忧脚本，网页设计师(W3CN)，JavaScript教程网
  • 团队Blog：淘宝，口碑，阿里巴巴国际站，阿里巴巴中文站，阿里巴巴中文站前端开发团队(方凳)，阿里妈妈，支付宝，阿里软件，19楼，九天音乐，金蝶与友商网
  • 个人Blog，这里列出的是原创并更新相对频繁的博客，如有遗漏，请告之(sorrycc#gmail.com)：怿飞，手气不错，Realazy，old9(需穿墙术)，沙滩凉鞋(空帏)，射雕(玉伯)，Aether，振之，嗷嗷，JunChen，爆牙齿，秦歌，克军，5key，小志，Rage(正淳)，麦鸡，云烈，老冒，番茄红了，Joyqi，卢力，CSS森林(Ghost)，Twinsen，Gulu77，Rlog，Dlog，子鼠，西风坊 …

－－－－－－
看了上面的内容，其实可以感觉得到国内的站点是什么样的。个人博客中还是有很多人研究一些东西，但走来走去，还是那些人的小圈子。你说呢?
如果你打不开原文地址的话，那么我就不得不说几句了，有时候，有个个人博客还是很有用的。
1、记录自己的开发心得，用与和其他人交流
2、摘抄一些信息，用于做数据的储存
3、也正是有了博客，除了做交流外，还能赚一些域名费和空间费（当然，我的服务器是我自己买 的和托管的，巨亏啊）

最近在做ipad上的网页处理的时候，经常需要切换横竖屏。于是找了一下资料，写了一个简单的判断：

function check(){
     var s,screen = (window.innerWidth > window.innerHeight) ? "portrait" :"landscape";
     if(s!=screen){
         s=screen;
         alert(s);
    }
}
然后在document.addEventListener("DOMContentLoaded",function(){
     //在这里加入
    window.addEventListener("orientaionchange",check,false);
    //然后就是很重要的一句：
    setInterval(check,300);
})

为什么要用setInterval，就是因为每一次切换都要迅速判断，因此不得不用setInterval，否则第一次判断后就不会再处理了。。

在博客园看到有人在介绍CoffeeScript，以前仿佛看过类似的东西。所以去官方看了一下，结果发现现在的代码是不是都在追求所谓的语义化？
比如你看这一段 ：

mood = greatlyImproved if singing  if happy and knowsIt   clapsHands()   chaChaCha() else   showIt()  date = if friday then sue else jill  options or= defaults 
然后所谓生成后的代码就成了这样：
var date, mood; if (singing) mood = greatlyImproved; if (happy && knowsIt) {   clapsHands();   chaChaCha(); } else {   showIt(); } date = friday ? sue : jill; options || (options = defaults); 
看到上面的这段生成后的代码，再对比一下原来的写法，是不是觉得很有意思？
再来一段长的：
grade = (student) ->   if student.excellentWork     "A+"   else if student.okayStuff     if student.triedHard then "B" else "B-"   else     "C"  eldest = if 24 > 21 then "Liz" else "Ike" 
输出之后就是：
var eldest, grade; grade = function(student) {   if (student.excellentWork) {     return "A+";   } else if (student.okayStuff) {     if (student.triedHard) {       return "B";     } else {       return "B-";     }   } else {     return "C";   } }; eldest = 24 > 21 ? "Liz" : "Ike";
越来越发现，原来写伪代码也可以转换成代码。而且看上去也不错，有点象zen coding了。现在很多IDE都支持zen coding
不知道这次这个coffeescript什么时候会被支持
官网：http://jashkenas.github.com/coffee-script/
但是对于用户来说，有一点压力，因为它还是会有一些学习成本。