前端er是否忽略了某些东西？——读《ppk谈JavaScript》

关于书

　　“不知道ppk的网站QuirksMode，说明你可能还没有真正成为资深的JavaScript程序员。”

——Roger Johansson，瑞典资深Web专家。

　　ppk是世界级前端技术专家，Web标准的布道者，在《ppk on JavaScript》中，他向读者介绍了JavaScript这门流行语言。

　　这本书从第五章开始依次介绍了JavaScript Core，BOM，DOM，和Ajax。整本书通读下来后，发现ppk重点关注原生API在各浏览器下的兼容性，但是限于篇幅，《JavaScript高级程序设计》这本书可能做的更加出色。然而与其它书籍不同的是，网站的可访问性被ppk作为重要论点写在了这本书中，这也是它另人印象深刻的原因所在。

重要论点：网站的可访问性

　　可访问性是指你的网页对任何人、在任何环境下都是可以可持续访问的。特别是某些用户，他们被迫忍受着一些无法改变的状况，如弱视、浏览器不能（或不充分）支持JavaScript等。

　　ppk在书的开端点题，强调网页的可访问性，在结尾甚至一度作出“Ajax炒作必将终结，JavaScript用途将被重新定义”的预言。 可谓是首尾呼应，论点突出啊！

　　ppk在书中举了一些例子向我们介绍可访问性：

　　1.链接必须有href（p33）。

<a href="#" onclick="showPopup('niceimage.jpg')">Nice Image!</a>

　　当一个无脚本用户点击这个链接时，什么也不会发生，因此这个页面不具备可访问性。相反，

<a href="niceimage.jpg" id="nice">Nice Image!</a>
document.getElementById('nice').onclick=function(){
    showPopup(this.href);
}

　　这样的编写形式不仅进行了行为与结构的分离，还保持了页面的可访问性。

　　类似的，当一个超链接并非链接到一个资源，而是为了触发脚本时，很多人会这样写：

<a href="javascript:void(0)" onclick="doSomething();">Do Something</a>
或
<a href="javascript:doSomething()">Do Something</a>

　　当一个禁用了脚本的用户点击这个链接时，什么事也不会发生。这个时候ppk建议我们使用DOM生成这种超链接，假如用户禁用了脚本，那么他根本不会看到这些链接，也不会带来"为什么我点击了却没反应"这种困惑了。

　　总之，对超链接的href来说，要不就让它包含一个URL地址以便那些禁用脚本的用户可以继续访问，要不就由JavaScript来生成这个链接。

　　2.用JavaScript隐藏内容（p34）

　　以表单提交为例，借助选择性呈现的表单元素，可以提高页面的易用性。根据用户的前一个选择，来决定接下来呈现的表单元素，而不是将所有的元素一股脑地呈现出来。我们的一般思路是将这些选择性呈现的元素用CSS隐藏，然后用脚本监听用户行为，符合操作条件后改变样式，将隐藏元素显示出来。不难想象，一个禁用了脚本的用户将永远无法看到这些隐藏的表单元素。

　　ppk建议使用JavaScript隐藏这些选择性呈现的元素，而非CSS。这样当脚本被禁用时，它们就不会隐藏，可访问性被完整地保持下来。

　　3.可点击的元素（p36）

　　依赖键盘的Tab操作，可以使页面元素切换焦点。浏览器默认的可获得键盘焦点的元素只有链接、表单域和按钮。以下拉菜单为例，它使用mouseover事件来触发下拉菜单，为了保持键盘用户的可访问性，还需要为其添加一个focus事件监听，然后，为了触发focus事件，键盘用户必须可以把焦点落到下拉菜单上。如果做不到这点，那么脚本仍然是不可访问的。ppk建议任何键盘友好的事件或脚本都应该被设置在链接、表单和按钮上。

　　注：tabindex用来控制用户使用tab键导航时的顺序，使tabindex等于负值，例如tabindex="-1"，可以使div等不能获焦的元素监听和触发onfous事件，但无法使用Tab键获取键盘焦点。使tabindex等于正值，div既可触发onfocus，也可使用tab键导航。

　　“JavaScript的目标都围绕着酷炫的技术，而不是可用性”，这是在JavaScript历史中反复出现的情况。DHTML带来铺天盖地的弹窗广告、闪烁而不友好的动画，一度使JavaScript声名狼藉。如今Ajax的盛行再次掀起了人们对技术的追捧，人们往往围绕着如何实现Ajax,如何使用Ajax做一些酷炫的事情，而很少有人关注可用性和交互问题，即为什么要用Ajax？ppk相信，Ajax最终会像DHTML那样终结：人们会完全对它失去兴趣，而它将会原形毕露，只是少量的JavaScript和大量的空话。他希望JavaScript开发者们可以学到很酷的代码、花哨的库或框架背后的东西——使它们的行为都基于脚本运行环境。

我的看法

　　《ppk on JavaScript》这本书写于2006年，那是个Ajax浪潮大爆发的年代，对待一个充满诱惑力的技术，ppk仍然能够不失理智地去剖析其中可能存在的问题，他的钻研和质疑精神无疑是QuirksMode成功的重要原因。"JavaScript用来做什么？“已经没有人去回答了，前端帝国日渐壮大，服务器变为一个“数据源”，JSON和Node.js的诞生加剧了这种变化。前端可以实现的功能越来越多，它的作用作用越来越大，代码量也越来越大，如果不进行模块化，势必会加剧码农编程的痛苦， 于是各种MVC，MVVM框架，各种模块化规范开始盛行。

　　我们是否如ppk所说，忽略了网页的可用性？天猫，一个电子商务网站，离开了JavaScript，将无法完成任何一笔订单。一些依赖JS库组装的网站甚至连页面结构都呈现不出来。

　　但是，没办法。图片过多，结构过于复杂，DOM树过于庞大，一次加载完用户体验过于的差。当人们发现JavaScript和Ajax可以解决这些矛盾时，自然会拼命抓住这棵救命稻草。至于未来庞大的前端帝国是否会坍塌，JavaScript的用途是否会被重新定义，没人可以预料。然而，并不是说ppk的说法是错的，DOM和Ajax的的确确滥用充斥在互联网中，类似天猫，百度地图这种互联网应用理所当然可以依赖它们，但是像新闻类、门户类、公司主页等网站都盲目跟风，依赖于Ajax来呈现内容，这无疑应该引起深刻思考。

　　不管怎么说，如今只会验证个表单，写个DOM操作的程序员已经满足不了时代的需求了，当全世界都在喝咖啡时，你还在考虑为什么大家都喝咖啡，而不是喝可乐，无疑有点可笑了，不过这个碎碎念留在饭后还是不错，万一真理真的掌握在少数人手中呢？比如，ppk。

　　最后，附上书的照片一张。

　　（完）