[jQuery] 1.3.2 和 1.4 的比較

jQuery 近來都差不多成為最多人用的javascript framework 了。

近來jQuery 推出新的release 1.4. 聽聞 performance 改善了很多。

No. of Function Calls (因為減少了很多不必要 method 的call,可能就是大大改善performance 的原因)

dom 的insertion 看來需要的時間真是快了很多 (ie 系列快了很多)


Performance of .html() ,重大的speed 改善

Performance of .remove() and .empty() ,很強呢~

Lets take a closest look at some useful changes

*
All setter method now accept a function as value:

.css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .before(), .after(),.replaceWith(), .wrap(), .wrapInner(), .offset(), .addClass(), .removeClass(), and.toggleClass().

$(‘div.demo-container’).html(function() { var emph = ” + $(‘p’).length + ‘ paragraphs!’; return ‘All new content for ‘ + emph + ”; });

*
Quick Element Construction:

When you create a single element with the jQuery function, you can now pass in an object to add attributes and events at the same time:

jQuery(”

“, { id: “foo”, css: { height: “50px”, width: “50px”, color: “blue”, backgroundColor: “#ccc” }, click: function() { $(this).css(“backgroundColor”, “red”); } }).appendTo(“body”);

* Event Multi-binding:
You can now pass an object of many events to bind to an element:

$(“div.test”).bind({ click: function(){ $(this).addClass(“active”); }, mouseenter: function(){ $(this).addClass(“inside”); }, mouseleave: function(){ $(this).removeClass(“inside”); } });

* All Events Can Be Live Events:
Has been introduced cross-browser support for change, submit, focusin, focusout, mouseenter, and mouseleave via the event delegation in .live(). Note that if you need a live focus event, you should use focusin and focusout rather than focus and blur, because focus and blur do not bubble. Also, live() also now accepts a data object, just as bind() has:

$(“p”).live(“myCustomEvent”, function(e, myName, myValue){ $(this).text(“Hi there!”); $(“span”).stop().css(“opacity”, 1) .text(“myName = ” + myName) .fadeIn(30).fadeOut(1000); }); $(“button”).click(function () { $(“p”).trigger(“myCustomEvent”); });

* before, after, replaceWith on disconnected nodes:
You can now use before, after, and replaceWith on nodes that are not attached to the DOM. This allows you to do more complex manipulations before inserting the final structure into the DOM.

jQuery(” “).before(“Hello”).appendTo(“body”)

* .offset( coords | Function )
It is now possible to set the offset of an element. Offset, like all setter methods, can now also accept a function as a second argument.

$(MyEl).offset({ top: 10, left: 30 });

* New .delay() method:
The .delay() method will delay any further elements in the queue for the specified number of milliseconds.

$(“div”).fadeIn().delay(4000).fadeOut();

developer 當然會擔心,update 了之後會有問題。
但~其實只有很少的地方是incompatible 已而~

* .add() no longer plainly concatenates the results together, the results are merged and then sorted in document order.
* .clone(true) now copies events AND data instead of just events.
* jQuery.data(elem) no longer returns an id, it returns the element’s object cache instead.
* jQuery() (with no arguments) no longer converts to jQuery(document).
* .val(“…”) on an option or a checkbox is no longer ambiguous (it will always select by value now, not by text value).
* jQuery.browser.version now returns engine version.
* jQuery is now strict about incoming JSON and throw an exception if we get malformed JSON. If you need to be able to evaluate malformed JSON that is valid JavaScript, you can make a text request and use eval() to evaluate the contents.
* Param serialization now happens in the PHP/Rails style by default. You can use jQuery.ajaxSettings.traditional = true; to use traditional parameter serialization. You can also set the behavior on a per-request basis by passing traditional: true to the jQuery.ajax method.
* jQuery.extend(true, …) No longer extends non-plain-objects or arrays.
* If an Ajax request is made without specifying a dataType and it is returned as text/javascript, it will be executed. Previously, an explicit dataType was required.
* Setting an Ajax request’s ifModified now takes ETags into consideration.

Source: http://blog.skitsanos.com/2010/01/what-is-new-in-jquery-14-features-for.html

Share
About Chowky
Chowky 希望可以透過這個blog 來分享自己學到的知識。亦希望可以分享最新的資訊。 IT 轉變得很快,要常常留意市場的變化,面對大陸的競爭,香港的 IT 方面的人才要更有市場觸覺,緊貼市塲走勢。因為其他地方的IT技術已經走得比以往更快。不進則退,就讓大家一起來交流、提昇IT的心得! Chowky 因為工作關係,所以一開始接觸的是visual basic, foxpro ( 這不代表我老 ) 之後是 .NET, MSSQL 和 Crystal Report. 由工作學到的project management, system analysis and design 以及 system testing, user acceptance tests and different documentations. 另外,由不同的freelance 方面學到dreamweaver, javascript, php, mysql. 後來興起CMS wave, Chowky 亦學會了Joomla! 以及常用的javascript framwork: jquery and mootool. 連deisgn 都要自己包辦,所以接觸了photoshop, illustrator, firework. 新的工作方面,要利用RIA -- Flex and AIR 方面的技術。所以緊接下來應該會多一點分享ria 方面的技術 Chowky 所說的未必是對的,但我深信我所說的是未來 IT Trend. 大家亦應抱著懷疑的態度去分析每一件事,未經思考不要輕易相信。

2 Comments

  1. wow…有很多我都不懂,看來要好好catch up 才行~

Leave a Reply