不唐突的JavaScript的七条准则[翻译]（3）
作者：Dreamer 来源：蓝色理想 发布时间：2008-12-09 13:33:00
4.理解浏览器和用户（在既有的使用模式上创建你所需要的东西）
不唐突的JavaScript 中很重要的一部分就是理解浏览器是如何工作的（尤其是浏览器是如何崩溃的）以及用户期望的是什么。不考虑浏览器你也可以很容易地使用JavaScript创建一个完全不同的界面。拖拽界面，折叠区域，滚动条和滑动块都可以使用JavaScript创建，但是这个问题并不是个简单的技术问题，你需要思考下面的问题：
这个新界面可以独立于输入设备么？如果不能，那么可以依赖哪些东西？
我创建的这个新界面是否遵循了浏览器或者其它富界面的准则（你可以通过鼠标在多级菜单中直接切换吗？还是需要使用tab键？）
我需要提供什么功能但是这个功能是依赖于JavaScript的?
最后一个问题其实不是问题，因为如果需要你就可以使用DOM来凭空创建HTML。关于这点的一个例子就是“打印”链接，由于浏览器没有提供一个非JavaScript的打印文档功能，所以你需要使用DOM来创建这类链接。同样地，一个实现了展开和收缩内容模块的、可以点击的标题栏也属于这种情况。标题栏不能被键盘激活，但是链接可以。所以为了创建一个可以点击的标题栏你需要使用JavaScript将链接加入进去，然后所有使用键盘的用户就可以收缩和展开内容模块了。
解决这类问题的极好的资源就是设计模式库。至于要知道浏览器中的哪些东西是独立于输入设备的，那就要靠经验的积累了。首先你要理解的就是事件处理机制。
5.理解事件（事件处理会引起改变）
事件处理是走向不唐突的JavaScript的第二步。重点不是让所有的东西都变得可以拖拽、可以点击或者为它们添加内联处理，而是理解事件处理是一个可以完全分离出来的东西。我们已经将HTML,CSS和JavaScript分离开来，但是在事件处理的分离方面却没有走得很远。
事件处理器会监听发生在文档中元素上的变化，如果有事件发生，处理器就会找到一个很奇妙的对象（一般会是一个名为e的参数），这个对象会告诉元素发生了什么以及可以用它做什么。
对于大多数事件处理来说，真正有趣的是它不止发生在你想要访问的元素上，还会在DOM中较高层级的所有元素上发生（但是并不是所有的事件都是这样，focus和blur事件是例外）。举例来说，利用这个特性你可以为一个导航列表只添加一个事件处理器，并且使用事件处理器的方法来获取真正触发事件的元素。这种技术叫做事件委托，它有几点好处：
你只需要检查一个元素是否存在，而不需要检查每个元素
你可以动态地添加或者删除子节点而并不需要删除相应的事件处理器
你可以在不同的元素上对相同的事件做出响应
需要记住的另一件事是，在事件向父元素传播的时候你可以停止它而且你可以覆写掉HTML元素（比如链接）的缺省行为。不过，有时候这并不是个好主意，因为浏览器赋予HTML元素那些行为是有原因的。举个例子，链接可能会指向页面内的某个目标，不去修改它们能确保用户可以将页面当前的脚本状态也加入书签。
0
投稿猜你喜欢
- 昨天在做mergeCSS的时候遇到两个正则匹配的问题，也花了不少的时间，最后在CSS森林群的 CE 同学帮助下，才完成了这俩正则，特别记录下
- 先按照下面的表结构创建mysql_order_by_test数据表，我们用实例一点一点告诉你，MySQL order by的用法。ORDER
- 昨天在网上看到一个防采集软件，说采集只访问当前网页，不会访问网页的图片、JS等，今天突然想到，通过动态程序和Js访问分别记录访问者的IP，然
- 我见朋友可以把数据库的记录显示到列表框里去，挺实用，也想做一个。怎么做啊？这简单，代码和说明如下：dblist.asp<html>
- 在VBScript中有Filter这个函数可以用来对数组进行过滤，并返回原数组的一个子集数组。语法说明： 引用内容Filter 函
- 修复Access数据库，我们一般使用微软Office 97中带的Access 97对数据库进行修复和整理。Access数据库被损坏分以下几种
从某种意义上来说，页面设计(web设计)也就是用户界面设计。有许多技巧可以帮助我们制作出漂亮、实用的界面，这里收集的5个小技巧就会对你有所帮- 8. 使用DECODE函数来减少处理时间使用DECODE函数可以避免重复扫描相同记录或重复连接相同的表. 例如: SELECT COUNT(
- 数据库快照是怎样工作的可以使用典型的数据库命令CREATE DATABASE语句来生成一个数据库快照，在声明中有一个源数据库快照的附加说明。
- 额……首先呢说说这个标题吧，实在不知道叫什么好，因为这个demo呢其实一个艾文王今天中午给丢给我一个图。他说这个是一个面试题，给我看看。这样
- oracle数据库的快照是一个表，它包含有对一个本地或远程数据库上一个或多个表或视图的查询的结果。正因为快照是一个主表的查询子集，使用快照可
- 如果你有一字段dm记录了一个url，为了更好的优化模糊查询速度或统计速度，在数据表原有的结构上增加3个字段，分别为 `sdm`
- 在网站开发的时候经常要用chr(),但本人比较懒没时间记那么多。于是到用到的时候就查，这样麻烦。现在将它写出来方便以后用到查，也方便大家!c
- 代码如下:CREATE TABLE #tmptb(tbname sysname,tbrows int ,tbREserved varchar
- 在默认情况下，Access 2000/2002数据库是以“共享”的方式打开的，这样可以保证多人能够同时使用同一个数据库。不过，在共享方式打开
- 鼠标双击滚动屏幕，单击停止滚动，很多小说新闻网站都有这个很人性化的功能，阅读起小说、新闻来很方便，不用手动拉滚动条。js代码如下：<h
- <SCRIPT language="javascript"> function&nbs
- 人类学是关于人的研究；社会人类学（social anthropology）是研究人类社会的学科。社会人类学还可以理解成“文化翻译”（the
- 用SQLyog来分析MySQL数据库：SOLyog的下载、安装以及使用很简单。我去了相关网站下载，它只有384K字节大小。它把两个文件(一个
- 在实现鼠标停在某元素上，会出现提示信息，以前我们太多是采用javascript脚本代码来实现。看了怿飞的IE中伪类:hover的使用及BUG
