Archive for October, 2008
不用try catch创建XMLHttpRequest对象
一直搞不明白为什么许多书上在创建XMLHttpRequest对象的时候一定要用try catch方法来做,用对象检测方法不是要简单得多吗?今天看kkp on JavaScript看到Data Retrieval这一章时决定好好分析一下这个问题,首先用以下代码测试:
if (XMLHttpRequest) alert('supported!');
马上就有新的发现,原来IE 7内部已经有了XMLHttpRequest这个对象,此前还一直以为所有的IE都不支持XMLHttpRequest对象的,原来是我读的基本JS的书籍都太老了,根本没有提及IE7已经开始支持XHR这个问题。
刚才的代码在IE6里面会报错,提示XMLHttpRequest未定义,if语句有一个特点很有意思:当遇到未定义的变量的时候会报错,而遇到未定义的属性时则不会报错。在支持XHR的浏览器里面XMLHttpRequest可以看成是一个全局变量,而所有的全局变量同时也是window对象的属性,那么方法就出来了,在if语句里面把XMLHttpRequest写成window的属性,即if (window.XMLHttpRequest),这样IE6就不会报错了。
做了一个小小的搜索看快就发现原来IE的开发人员正是用对象检测来创建XHR对象的:
if (window.XMLHttpRequest) {
// If IE7, Mozilla, Safari, etc: Use native object
var xmlHttp = new XMLHttpRequest()
}
else if (window.ActiveXObject) {
// ...otherwise, use the ActiveX control for IE5.x and IE6
var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
Update:projs中介绍一种更好的方法:
if ( typeof XMLHttpRequest == 'undefined' )
XMLHttpRequest = function() {
// Internet Explorer uses an ActiveXObject to create a new XMLHttpRequest object
return new ActiveXObject(
// IE 5 uses a different XMLHTTP object from IE 6
navigator.userAgent.indexOf('MSIE 5') >= 0 ?
'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP' );
};
//Create the request object
var xml = new XMLHttpRequest;
淘宝2007年的一道面试题
淘宝2007年有这样一个面试题:
小贤是一条可爱的小狗(Dog),它的叫声很好听(wow),每次看到主人的时候就会乖乖叫一声(yelp)。
从这段描述可以得到以下对象:
function Dog() { this.wow = function() { alert(’Wow’); } this.yelp = function() { this.wow(); } }小芒和小贤一样,原来也是一条可爱的小狗,可是突然有一天疯了(MadDog),一看到人就会每隔半秒叫一声(wow)地不停叫唤(yelp)。
请根据描述,按示例的形式用代码来实现(提示关键字: 继承,原型,setInterval)。
淘宝UED上给出的答案是:
function MadDog() {
this.yelp = function() {
var self = this;
setInterval(function() {
self.wow();
}, 500);
}
}
MadDog.prototype = new Dog();
//for test
var dog = new Dog();
dog.yelp();
var madDog = new MadDog();
madDog.yelp();
经过我的测试发现:如果把self.wow后面的括号去掉,那么外面那层匿名函数也是可以去掉了,所以setInterval部分可以这么写:
setInterval(self.wow,500);
后来我又尝试了两外一种解法:
MadDog=new Function;
MadDog.prototype=new Dog();
MadDog.prototype.yelp=function() {
setInterval(this.wow,500);
}
//for test
var madDog=new MadDog();
madDog.yelp();
这种写法看上去要比淘宝上的答案要简单,经测试也是可以达到题目要求的。既然MadDog的yelp方法要变,那就就直接在后面把从Dog继承来的prototype属性覆盖一遍就OK了,不知道这种写法有没有什么不妥,毕竟人家都是高手,而我只是菜鸟一个。
《无懈可击的web设计》小结
《无懈可击的web设计》这本书讲了许多提高网站灵活性、可维护性和可访问性的一些小技巧,读过之后发现里面讲的许多方法都是以前没有注意到的,所以有必要对其中的一些内容做一个小小的归纳总结,一方面可以加深印象,另一方面也可以作为一个备忘录以便将来查阅。
1.用关键字和百分比来确定文字大小以便使用户也能控制其大小,并且最大化网页的灵活性。
在body上使用font-size:small来设置全局的文字大小,然后在其他地方全部用百分比来控制,这样不仅可以使得IE用户可以通过菜单栏的“查看>文字大小”来控制文字大小,而且以后要对文字大小进行调整的时候只需要调整一条声明就可以让整个网页的文字大小按比例缩放,使得灵活性大大提高。
2.让导航菜单能够适应任意的文字大小和任意多的内容。
对导航菜单既不要定宽也不要定高,对于菜单内文字和边缘之间的间隙则用padding来填充,这样就适应了任意的文字大小和任意多的内容,对于滑动门菜单也是如此,我以前在写滑动门的时候习惯把高度定死,这并不是一个好习惯。此处还要注意的是如果背景图是渐变效果则要将背景图适当地加长和加高以适应各种长度和高度的内容。
3.用em来作为line-height的单位,同样的,对于两行文字之间margin值也用em为单位。
用em做单位的好处是当文字大小改变的时候此处的line-height和margin也会相应地改变。
4.对一些水平的区块也不要定高,让其高度自适应。
一些水平区块如头部、登录区、搜索区和一些单行文字的区域也不要定高,一方面是为了适应文字大小的变化,另一方面也使得以后在该区块增加内容后不至于使页面变形,例如单行的文字有可能在以后增加到两行。所以以前通过定高度和行高来处理单行文字的做法要改为不定高度并用padding填充文字上下的空白区域。
5.确保页面在禁用图片和CSS的时候仍然不影响正常阅读。
背景图未加载有可能造成文字和下面的背景颜色太接近而使网页阅读困难,解决方法是在凡是有背景图的地方都写上一个背景颜色。作者把裸奔测试称为“十秒钟可用性测试”,就是禁用CSS之后再看页面结构是否清晰,这就要求做好HTML的语义化。一些方便做此类测试的小工具:
- FAVELETS 实际上就是一些JavaScript代码写成的书签
- Web Developer Toolbar For Firefox
- Web Accessibility Toolbar For IE
6.用border-collapse:collapse;实际上可以替代talble上的属性cellspacing=0,唯有IE/MAC不支持border-collapse,但是IE/MAC现在可以忽略掉了吧。
7.在使用百分比宽度的流体布局中为栏间设定固定像素间距的方法是在每栏的里面加入一个div并在这个里层的div上加上padding。
8.即便是对使用百分比宽度的流体布局也可以使用背景图垂直重复的方法来造成貌似两栏等高的假象,方法是将背景图的水平位置也用百分比来设置。
NLP作用被夸大
网上有许多文章夸耀NLP作用的强大,称能使人在短时间内发生重大的改变,或者称能利用NLP在人际交往中迅速与他人取得契合等等。一段时间我曾信以为真,为了好好钻研一下这门学科,我专门花了180元从广州海外书店购买了两本书——《青蛙变王子》和《复制卓越–烙印技术》,均为台湾出版的影印版,印刷质量差就不说了,而且是竖向排版加繁体字,读起来很吃力。这两本书据说是集NLP理论之大成的经典之作,可在我看来都没什么实用价值,《复制卓越–烙印技术》的作者之一是NLP创始人理查·班德勒的妻子,这本书听名字很吸引人,可真正读起来简直要命,全部是空洞而又复杂的理论,却又不告诉你究竟改怎么做,倒像一本讲心理学理论的专业书籍。另一本《青蛙边王子》是创始人理查·班德勒自己的作品,其中大部分的篇幅都在谈论如何通过观察对方眼珠的移动来推测此人属于什么类型的人,而NLP大部分理论都建立在这个理论基础之上。
直到前一段时间我逛维基百科才知道,NLP早在80年代末就被怀疑为伪科学,在一九八几年期间,大部分的试验都表明找不到作为NLP理论基础的Prefered Representational System(PRS)存在的证据,而且“眼睛的移动(eye movements)”和“说话时采用的谓语(spoken predicates)”以及“大脑内的图像(internal imagery)”之间也没有多大的关联,此外,通过模仿对方的神态、说话的语气和语速、动作来产生契合也被证明是没有效果的。尽管NLP此后很少在正统的心理学中被提及,但是作为一种民间的提供咨询服务的培训课程被流传下来,并且形成了一种迷信。
尽管作为一种提供咨询服务的课程,NLP从别的地方吸收了许多实用的技巧,但这些并不是NLP原创,而其创始人理查·班德勒和约翰·格林德也因为发表了未经试验证实的理论而受到人们对其人品的质疑。安东尼·罗宾斯这位潜能激发大师的课程里面有很多技巧明显是从NLP吸收过来的,可他却很少提及他的课程和NLP有任何的关联,也许是害怕受到NLP并不太好的名声的牵连吧。总而言之,毫无疑问的是NLP的作用被人为地夸大了。
阻止IE在浏览本地文件时发出安全警告
IE浏览器在打开本地文件的时候,如果文件内有JavaScript或者flash等活动内容,就会弹出一个安全警告:“为了有利于保护安全性,Internet Explorer已限制此网页运行可以访问计算机的脚本或ActiveX控件。请单击这里获取选项…”。对于普通用户来说这不会有太大的影响,但是对与一个经常需要调试JavaScript的网页开发者来说这个东西就相当令人烦恼了。不过幸好我在这里找到了解决办法。一位网友提出了三种解决方案:
方案一:用firefox作为你的默认浏览器。
方案二:让IE允许运行本地脚本文件:
- 在IE的工具菜单选择Internet选项;
- 在Internet选项窗口中选择高级选项卡;
- 在安全部分勾选“允许活动内容在我的计算机上的文件中运行”。
设置完毕之后重启IE就不再会出现烦人的安全警告了。
方案三(不推荐):
在你的页面文件中加入如下代码:
<!-- saved from url=(0014)about:internet -->
或者
<!-- saved from url=(0016)www.yoursite.com -->
注意:括号中的数字是后面网址的长度,你可以把这段代码加入HTML文件的head区域。
问题是加入了这段代码的文件无法链接到不含这段代码的页面,所以只有在你确定没有外部链接时才推荐方案三。
很显然对一个开发人员来说,方案一是不可取的,因为即使默认用firefox,也不可避免要在IE中调试,方案三也不好,方案二则比较完美。
拿破仑之死
最近读了一本拿破仑的传记,拿破仑在1815年兵败滑铁卢之后被流放到圣赫勒拿岛,在岛上度过6年的流放生涯后病死。由于拿破仑的死因几百年来一个是许多人争论的未解之谜,所以对这个问题产生了一点兴趣,在网上搜索到一些资料,拿破仑之死主要有如下两种说法:
1.死于胃癌或者胃溃疡。他的父亲和三位位妹妹也是死于胃癌,所以这种猜测有一定的合理性,也有一些证据支持这种猜测,首先是拿破仑晚年的私人医生 和拿破仑尸体的解剖者安东马尔西(拿破仑的科西嘉老乡)和解剖现场六位英国医生发现他的胃部有一块溃疡,但是没有人能指出实际的癌病灶来。另一个证据是瑞 士巴塞尔大学医院的一位解剖病理学专家发现拿破仑流放期间穿过的12条裤子的腰围变化和胃癌病人的完全一致。
2.死于砷中毒。2001年有研究人员发现保留下来的拿破仑的头发中砷的含量是正常人砷含量的13倍,由此推测拿破仑死于砒霜(主要成分三氧化二 砷)或慢性砷中毒。此种说法又分为两种情况,一种是拿破仑生活的环境中砷含量较大,因此中毒,另一种说法是他的亲信蒙托龙故意投毒到拿破仑的食物和饮料之 中,并且蒙托龙的动机有两种可能性,一是他的妻子和拿破仑有染而决定毒死拿破仑,二是他故意让拿破仑出现慢性砷中毒的病症,然后博得英国人的同情,把他们 遣送会法国。不过2008年2月12日又有报道称意大利的科学家们取得了拿破仑几个年龄段的头发样本和妻子、儿子的头发样本并发现这些样本中的砷含量都比 现代人头发中的砷含量高出100倍,并且拿破仑小时候头发中的砷含量和死时的含量并无区别,由此得出结论:“总体而言,所有200年前的头发样本中的砷含 量都比现今活着的人的头发样本中的砷含量高出100倍。事实上,19世纪初砷在环境中大量存在,虽然已达到了我们今天认为的非常危险的水平。”如果研究结 果属实,那么足以推翻所有死于砷中毒的猜测。