jQuery 1.1.4 更新说明(一)

香水坏坏 发表于 2007-8-27 [Javascript]

8月23号jquery发布了jquery 1.1.4版

最新版的jquery你可以从下面地址根据需要下载：

随意命名jQuery（下面会告诉你如何去做）

这样的做有二个目的：

  • 现在在同一个页面，你可以同时使用多个版本的jQuery
  • 你可以把jQuery加到其他对象或库的命名空间。如：
JavaScript代码
  1. // 添加到dojo里面
  2. dojo.jquery = jQuery.noConflict(true);   
  3. dojo.jquery("#elem div").slideDown("slow");   
  4. // 或者添加到YAHOO
  5. YAHOO.query = jQuery.noConflict(true);   
  6. YAHOO.query("span.hidden").removeClass("hidden");  

速度性能上的提升

提升了jQuery三大常用部分的速度：ID selectors, tag name selectors, each() loops。

下面给出的是这3个方面的测试速度数据

 

$(”#id”) 提升

Browser jQuery 1.1.3 jQuery 1.1.4 % 提升
IE 6 651ms 70ms 830%
Firefox 2 1355ms 27ms 4919%
Safari 3 101ms 14ms 620%
Opera 9 270ms 62ms 335%
平均提升: 1676%

$(”elem”) 提升

Browser jQuery 1.1.3 jQuery 1.1.4 % 提升
IE 6 661ms 451ms 47%
Firefox 2 1717ms 143ms 1100%
Safari 3 99ms 83ms 19%
Opera 9 226ms 198ms 14%
平均提升: 295%

.each() 提升

Browser jQuery 1.1.3 jQuery 1.1.4 % 提升
IE 6 200ms 30ms 567%
Firefox 2 468ms 29ms 1514%
Safari 3 17ms 11ms 54%
Opera 9 45ms 25ms 80%
平均提升: 554%

新加入的函数/方法

.slice()

你可能在javascript数组里见过这个方法--这对你来说太幸运了，因为他们的所产生的行为是一样的。这个方法用来从匹配的jQuery对象中分离出一部分jQuery对象的再好不过了。下面是调用slice()方法的一些正确方式：

JavaScript代码
  1. $("div").slice(0,1); // 第一个 div   
  2. $("div").slice(-1); // 最后一个 div   
  3. $("div").slice(1,-1); // 除第一个最后一个的所有 div
  4. $("div").slice(1,3); // 第二个和第三个 div
  5. $("div").slice(7,8); // 第八个 div

:has()

这是一个新的选择器用来替换以前用来检查元素是否在例外一个元素的功能(div[p]).现在你可以用这个选择器来取代以前的XPath选择器了，如下：

JavaScript代码
  1. // 所有包含p的div
  2. $("div:has(p)")   
  3. // 所有包含img标签的a
  4. $("a:has(img)")   
  5. // 所有包含a标签的div并且a标签还包含img标签
  6. $("div:has(a:has(img))")  

深度，递归式的 .extend()

新的extend()允许你更深度的合并镶套对象。下面的例子是一个很好的证明。

JavaScript代码
  1. // 以前的 .extend()   
  2. jQuery.extend(   
  3.   { name: “John”, location: { city: “Boston” } },   
  4.   { last: “Resig”, location: { state: “MA” } }   
  5. );   
  6. // 结果:   
  7. // => { name: “John”, last: “Resig”, location: { state: “MA” } }
  8. // 新的更深入的 .extend()   
  9. jQuery.extend( true,   
  10.   { name: “John”, location: { city: “Boston” } },   
  11.   { last: “Resig”, location: { state: “MA” } }   
  12. );   
  13. // 结果   
  14. // => { name: “John”, last: “Resig”,   
  15. //      location: { city: “Boston”, state: “MA” } }  

 

.noConflict()

如上面提到的，这个功能允许你完全重命名'jQuery'命名空间以及'$'。

你可以象下面一样使用新的快捷名称：

 

JavaScript代码
  1. // 自定义jQuery名称:   
  2. var jq = jQuery.noConflict(true);   
  3. jq("#id div").hide();   
  4.   
  5. // 失败 - $ 和 jQuery 已经被重命名:   
  6. $("#id div").hide();   
  7. jQuery("#id div").hide();  

 

也可以用这种方式把jQuery放到已经存在的名称空间，如：

 

JavaScript代码
  1. // 把jQuery放到命名空间里:   
  2. var obj = {};   
  3. obj.jq = jQuery.noConflict(true);   
  4. obj.jq("#id div").hide();  

 

[jQuery 1.1.4 更新说明(二)]

[原文地址]

2214 5 标签：JQUERY 
访客评论
  • 小K  最近的 jQuery 学习  [2007-11-21]
    Trackback from 小K jQuery 1.1.4 更新说明
  • omeweb    [2007-9-30]
    不做的，辛苦了，谢谢你。
  • 香水坏坏    [2007-9-5]
    这里有个别人建的性能测试网页，你可以点开看看，里面对比了jquery1.1.4与1.1.3还有其他一些框架
    http://experiment.bcse.info/slickspeed
  • aaaa    [2007-9-5]
    速度性能上的提升???
    不知道怎么测试的? 我感觉慢了不少
  • fdf    [2007-8-28]
    还真不错哦!!!!支持
  • zjfeiye    [2007-8-28]
    很详细,不过能否详细说明下.slice()的两个参数的含义么,你上面说的我实在是看不出什么规律来
FIRST1LAST
发表评论
  • 你的姓名：
  • 你的网站：
  •   EMAIL：   
  • 评论内容：
  • 私人