读jQuery基础教程时的需要注意的1.1和1.2版的差别

jQuery基础教程这本书已经出版咯~
这本书可以用于快速入门,大大缩短jQuery入门所需要的时间(实际上就算没有这本书,看现有的资料,1个星期也足够入门了)。
但还是强烈建议购买此书,因为这能让你能达到看现在有资料好几个月也未必能达到的水平。
至少我现在依然能从上面学到不少东西!

最近书到手了,翻阅了一下
也知道由于译者比较忠于原著,所以未能对其中少部分过时的内容予以修订。
看到他写了不少的“译者注”,但对于1.2的更新是完全没有涉及。

已知的重大变更是:
(1),1.2以后中属性选择器均不需要@,但依然兼容1.1的选择器。
(2),第一章里提到了XPath选择符在1.2中因为不常用且影响效率而取消了,如需使用则需要兼容1.1中的XPath插件(http://plugins.jquery.com/project/xpath),同样第六章和第九章涉及XML解析等也无法使用XPath语法了。关于更多xml解析的问题,可以看http://shawphy.com/2008/01/load-xml-by-ajax-with-jquery-and-parse-it.html
(3),第五章,关于clone(false)的描述,在1.2中,已经整合了复制绑定事件的插件了,即增加了clone(true)功能用于连同元素绑定的事件一起复制。而取消了clone(false)这个只复制元素而不复制内容的方法。读者需要注意。可以用.clone().empty()代替。
(4),第七章中部分地方使用了已被废弃的gt()和lt()方法。可以使用slice代替,或者用:gt和:lt选择符代替。具体请参考文档。
(5),第十章,流行插件中,由于Dimensions插件过于流行,已经被整合进jQuery,所以你无需再另行导入。而Interface插件也已经更新换代,又官方重新编写后改名为jQuery UI。(http://ui.jquery.com

位于p最开始的span设置text-indent影响p的整个第一行,反继承

今天遇到这个问题
描述起来也蛮麻烦的
搜也搜不到,所以问了群里的朋友,
感谢Robin还有$一揪就出来,
他俩对此问题进行了深入的讨论,
感谢他们细心解答,真相才得以水落石出。
最后本文采用了$一揪就出来的方法:

如下代码

这里看不见,确可以复制到选中前边的框子,然后复制吧。
你可以复制所有本文

给最开始的span设置了text-indent属性之后,导致了整个父元素p的text-indent属性
IE6/7都确认有这个bug,可以说是一种反继承。

解决的方法是多一个标签,避开问题多多的text-indent,
设置内层标签的行高,以及padding-left。就能够大致解决问题了。
即保证了效果,也保证了文本的不丢失,为残障人士,搜索引擎,以及想要复制文章的人给予方便。
至少可以不用空格了,使用空格虽然可以轻松达到效果,无需使用text-indent了,但这显然不好。

这里看不见,确可以复制到。选中前边的框子,然后复制吧
你可以复制所有本文

用闭包制作简单动画效果

刚才用书上看来的写了一下,貌似还蛮好玩的
http://shawphy.com/demo/closure/animate.html
大家看那个小红方框
ie6请点上面链接查看效果,或者弹开后刷新一下看效果

function tipUpdown(obj){
var objorg=obj.css(“top”).replace(/px/,””)-0;
for(var i=0;i<10;i++){ (function(){ var b=i; setTimeout(function(){ obj.css({"top":b*1+objorg+"px"}) },b*20); setTimeout(function(){ obj.css({"top&":b*1+objorg+"px"}) },400-b*20); })(); }; }; setInterval("tipUpdown($('#ab'))",1000)

jQuery UI 1.5 正式版发布

原文:
http://jquery.com/blog/2008/06/09/jquery-ui-v15-released-focus-on-consistent-api-and-effects/
实在太长,懒得翻译了……

总体来说,蛮好用的看上去。官方的文档还没有完全跟上,只有老的一些了。
等下回官网的文档好了,我也一并更新下吧。

主要是统一了API

* $(”div”).draggable() creates a draggable
* $(”div”).draggable(”destroy”) destroys it
* $(”div”).draggable(”method”) calls another method on the plugin.

修正了N多的BUG

增加了http://script.aculo.us/这里很多特效

http://ui.jquery.com/themeroller
这里可以做自己的主题

http://ui.jquery.com/download
这里可以下载到最新版

http://docs.jquery.com/UI
这里是文档

记得datepicker吧,里边的简体中文部分是cloudream翻译的~

适用于firefox 3 的fierbug 和 web developer 中文版

两个版本都更新了一些东西,强烈推荐下载适用
这回两个都不是我翻译的。web developer 可能是基于我先前1.1.5翻译的,不管了,反正有中文版就是好的。
firebug我这个只是启用了简体中文版,我增加了一点点之前没翻译的

web developer 1.1.6
http://downloads.chrispederick.com/work/web-developer/web-developer-localized.xpi
firebug 1.2b3
点击下载firebug 1.2b3

firebug 1.2.0b6
https://addons.mozilla.org/zh-CN/firefox/addon/1843
下载的文件如FF不识别,则下载完后在资源管理器中把文件拖进FF即可开始安装

jQuery 1.2.6 发布信息

姗姗来迟的1.2.6的发布信息,其实本来是1.2.4的,结果扯出点小事来。
这回jq文件97.8K,直逼100K大关啦。估计下个版本就破了。
其实pack版破30也是很早以前的事情了
好了,多的不说了

主要是性能更新,
可以看这里:
http://spreadsheets.google.com/pub?key=pFIHldY_CksyThxfgx6krfA

没有IE6,被无视咯~

事件处理快了103% ——快了很多啊

CSS选择器快了13%——非常好,这个最重要了,越快越好。不过受限于正则的速度。。。是由于jQuery.map() 提升866% 还有 jQuery.extend() 19% 提升速度,所以导致整个都快了

.offset() 21%

.css() 25%

然后是新特性
Dimensions插件彻底融入jquery内核。这个上次已经说过了。

.attr()重写了,解决了15项bug

.toggle() 能接受更多函数了
比如:
$("div").toggle(function(){
$(this).removeClass("three").addClass("one");
}, function(){
$(this).removeClass("one").addClass("two");
}, function(){
$(this).removeClass("two").addClass("three");
});

.index() 支持jQuery集合了
var test = $("div.test");
$("div").index( test ) == 3

jQuery.makeArray可以把任何东西弄成数组了
jQuery.makeArray( document.getElementsByTagName("div") )
// => [ div, div, div ]

jQuery.makeArray( true )
// => [ true ]

jQuery.makeArray()
// => []

beforeSend 能取消Ajax调用了
$.ajax({
beforeSend: function(){
return $("#input").val() == "";
},
url: "test.php"
});

从上面代码上看,就是在beforeSend里,return true,就是取消请求。跟一般的return false不太一样。

动画的速度可以自己设置fast slow normal的值了。
jQuery.fx.speeds.slow = 1000;
$("#test").slideDown("slow");

总体来说,更新就这些了。