亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb

首頁 > 學院 > 開發設計 > 正文

jQuery的發展史,你知道嗎?

2019-11-14 16:44:40
字體:
來源:轉載
供稿:網友

2006年1月,jQuery的第一個版本面世,至今已經有6年多了(注:這個時間點是截止至出書時間)。雖然過了這么久,但它依然以其簡潔、靈活的編程風格讓人一見傾心。在本篇文章中,我們將講述jQuery的發展歷史,讓讀者對jQuery有更多的了解。

2005年8月,John Resig提議改進PRototype的“Behaviour”庫,于是他在blog上發表了自己的想法,并用了3個例子做說明。

第一個例子是為元素注冊一個事件:
Behaviour.register({
'#example li': function(e){
e.onclick = function(){
this.parentNode.removeChild(this);
}
}
});
他認為應該改寫為:
$('#example li').bind('click',function(){
this.parentNode.removeChild(this);
});
第二個例子是為不同的元素注冊不同的事件:
Behaviour.register({
'b.someclass' : function(e){
e.onclick = function(){
alert(this.innerHTML);
}
},
'#someid u' : function(e){
e.onmouSEOver = function(){
this.innerHTML = "BLAH!";
}
}
});
他認為應該改寫為:
$('b.someclass').bind('click',function(){
alert(this.innerHTML);
});
$('#someid u').bind('mouseover',function(){
this.innerHTML = 'BLAH!';
});
第三個例子是為不斷變化的元素注冊不同的事件:
Behaviour.register({
'#foo ol li': function(a) {
a.title = "List Items!";
a.onclick = function(){ alert('Hello!'); };
},
'#foo ol li.tmp': function(a) {
a.style.color = 'white';
},
'#foo ol li.tmp .foo': function(a) {
a.style.background = 'red';
}
});
他認為應該改寫為:
$('#foo ol li')
.set('title','List Items!')
.bind('click',function(){ alert('Hello!'); })
.select('.tmp')
.style('color','white')
.select('.foo')
.style('background','red');
這 些代碼也是jQuery語法的最初雛形。當時John的想法很簡單:他發現這種語法相對現有的javaScript庫更為簡潔。但他沒想到的是,這篇文章 一經發布就引起了業界的廣泛關注。于是John開始認真思考著這件事情(編寫語法更為簡潔的Javascript程序庫),直到2006年1月14 日,John正式宣布以jQuery的名稱發布自己的程序庫。隨之而來的是jQuery的快速發展。
2006年8月,jQuery的第一個穩定版本,并且已經支持CSS選擇符、事件處理和Ajax交互。
2007 年7月,jQuery 1.1.3版發布,這次小版本的變化包含了對jQuery選擇符引擎執行速度的顯著提升。從這個版本開始,jQuery的性能達到了Prototype、 Mootools以及Dojo等同類JavaScript庫的水平。同年9月,jQuery 1.2版發布,它去掉了對XPath選擇符的支持,原因是相對于CSS語法它已經變得多余了。這一版能夠對效果進行更為靈活的定制,而且借助新增的命名空 間事件,也使插件開發變得更容易。同時,jQuery UI項目也開始啟動,這個新的套件是作為曾經流行但已過時的Interface插件的替代項目而發布的。jQuery UI中包含大量預定義好的部件(widget),以及一組用于構建高級元素(例如可拖放、拖拽、排序)的工具。
注意:XPath(xml Path Language,XML路徑語言)是在XML文檔中識別不同元素或者元素值的一種語言,與CSS在HTML文檔中識別元素的方式類似。在涉及屬性選擇符時,jQuery使用了XPath中的慣例來標識屬性,即將屬性前置一個@符號并放在一對方括號中。例如,要選擇所有帶title屬性的鏈接,可以使用下面的代碼:
$('a[@title]')
但在jQuery 1.2去掉對XPath選擇符的支持后,這種寫法就不能用了,必須使用如下代碼:
$('a[title]')
在一些老的代碼和插件中這種問題比較常見。

2008 年5月,jQuery 1.2.6版發布,這版主要是將Brandon Aaron開發的流行的Dimensions插件的功能移植到了核心庫中,同時也修改了許多BUG,而且有不少的性能得到提高。因此,如果把你以前的 jQuery版本升級到1.2.6,那么你完全可以從你的代碼中排除Dimensions插件。

 

注意:Dimensions插件是一個獲得元素尺寸、定位的插件。
在 jQuery迅速發展的同時,一些大的廠商也看中了商機。2009年9月,微軟和諾基亞公司正式宣布支持開源的jQuery庫,另外,微軟公司還宣稱他們 將把jQuery作為Visual Studio工具集的一部分。他將提供包括jQuery的智能提示、代碼片段、示例文檔編制等內容在內的功能。微軟和諾基亞公司將長期成為jQuery的 用戶成員,其他成員還有Google,Intel,IBM,Intuit等公司。
2009 年1月,jQuery 1.3版發布,它使用了全新的選擇符引擎Sizzle,在各個瀏覽器下全面超越其他同類型JavaScript框架的查詢速度,程序庫的性能也因此有了極 大提升。這一版本的第2個變化就是提供live()方法,使用live()方法可以為當前及將來增加的元素綁定事件,在1.3版之前,如果要為將來增加的 元素綁定事件,需要使用livequery插件,而在1.3版中,可以直接用live()方法。
注意:Sizzle是jQuery作者John Resig新寫的DOM選擇器引擎。Sizzle有一個重要的特點,它是完全獨立于jQuery的,如果你不想用jQuery,可以只用Sizzle。Sizzle下載地址:http://sizzlejs.com/
2010年1月,也是jQuery的四周年生日,jQuery 1.4版發布,為了慶祝jQuery四周歲生日,jQuery團隊特別創建了jquery14.com站點,帶來了連續14天的新版本專題介紹。

在1.3及更早版本中,jQuery通過JavaScript的eval方法來解析json對象。在1.4中,如果你用的瀏覽器支持,則會使用原生的JSON.parse解析json對象,這樣對json對象的書寫驗證則更為嚴格。比如:{foo: "bar"}的寫法將不會被驗證為合法的json對象,必須寫成{"foo":"bar"}。如果你的程序打算升級到1.4版本,那么這一點要尤其注意。
2010 年2月,jQuery 1.4.2版發布,它新增了有關事件委托的兩個方法:delegate()和undelegate()。delegate()用于替代1.3.2中的 live()方法。這個方法比live()來的方便,而且也可以達到動態添加事件的作用。比如給表格的每個td綁定hover事件,代碼如下:
//1.4.2
$("table").delegate("td", "hover", function(){
$(this).toggleClass("hover");
});
//1.3.2
$("table").each(function(){
$("td", this).live("hover", function(){
$(this).toggleClass("hover");
});
});
2011年1月,jQuery 1.5版發布。該版本做了如下修改:

  • 重寫Ajax模塊

(1)最大的變化是調用jQuery.ajax(或jQuery.get,jQuery.post等)會返回jqXHR的對象,為不同瀏覽器內置的xmlhttpRequest對象提供了一致的超集,可以完成以前不可能完成的任務,比如:中止JSONP請求。
(2)提供了更高級的統一的API。
(3)更好的擴展性,可以方便地擴展Ajax的發送與接收,管理Ajax請求。

  • 新增延遲對象

開發人員借此可以使用無法立即獲得的返回值(如異步Ajax請求的返回結果),而且第一次能夠附加多個事件處理器。
比如,使用新的jQuery Ajax API實現下面的代碼:
// 發出請求,并記住jqxhr對象
var jqxhr = $.ajax({ url: "example.php" })
.success(function() { alert("success"); })
.error(function() { alert("error"); })
.complete(function() { alert("complete"); });
// 這里可以做其它工作 ...
// 完成另一個功能
jqxhr.complete(function(){ alert("second complete"); });

  • jQuery.sub()

可以方便地創建jQuery副本,不影響原有的jQuery對象,避免jQuery沖突。示例代碼如下:
(function(){
var sub$ = jQuery.sub();
sub$.fn.myCustomMethod = function(){
return 'just for me';
};
sub$(document).ready(function() {
sub$('body').myCustomMethod() ; // 'just for me'
});
})();

alert( typeof jQuery('body').myCustomMethod ); // undefined

  • 內部開發系統

jQuery團隊內部開發系統的兩點改變:一是服務器端用NodeJS替換了老的Java/Rhino系統,使得團隊可以專注于JavaScript環境的新變化;二是所用的代碼壓縮優化程序從Google Closure Compiler切換到UglifyJS,新工具的壓縮效果非常令人滿意。
2011年5月,jQuery 1.6版發布。該版本重寫了Attribute模塊和大量的性能改進。值得注意的是此次更新有2個破壞性的變更,將會影響到現有打算升級到1.6的那些項目。

  • 變更1:更新data()方法

在jQuery1.5中,data()方法可以用來將元素上的數據屬性轉化為JSON形式的值。JQuery 1.6已經更新了此功能,data()方法獲取的值會以駝峰形式展示,以配合W3C HTML5規范。比如:
//html:
<span data-max-value="15" data-min-value="5"></span>
//js:
$('span').data(); //jQuery 1.5.2輸出:{"max-value":15,"min-value":5}
$('span').data(); //jQuery 1.6 輸出: {"maxValue":15,"minValue":5}

  • 變更2:獨立方法處理DOM屬性,以區分DOM的attributes和properties

一般情況下,attributes表示從文檔中獲取DOM的狀態信息,而properties表示元素的動態狀態信息。比如:
//html:
<input type="text" value="abc">
//js:
$("input:text").attr('value') ; //輸出 abc
$("input:text").prop('value') ; //輸出 abc
如果用戶手動改變文本框的值為“abcdef”,那么:
$("input:text").attr('value') ; //輸出 abc
$("input:text").prop('value') ; //輸出 abcdef
同樣,如果網頁中的復選框的代碼如下:
<input type="checkbox" checked />
那么結果也會有所不同:
$(":checkbox").attr('checked'); //輸出'',空字符串
$(":checkbox").prop('checked'); //輸出 true
所以在jQuery 1.6中,如果要判斷復選框是否選中,需在事件處理程序中使用:
$(this).prop("checked")
//或者 $(this).is(":checked")

由于jQuery 1.6對attr()方法的改變,導致很多使用attr()方法的程序出現問題,必須修改為1.6的語法才能使用,這個不向前兼容的改變引起了開發的強烈不滿。于是在不到10天的時間里,jQuery 1.6.1發布,它調整了attr()方法,使其兼容1.6之前的做法。比如:
$(":checkbox").attr("checked", true);
$("option").attr("selected", true);
$("input").attr("readonly", true);
$("input").attr("disabled", true);
if( $(":checkbox").attr("checked") ) { /* Do something */ }
2011年11月,jQuery 1.7版發布。該版本做了如下修改:

  • 新的事件API:on()和off()

新的on()和off()API統一了jQuery中所有對文檔綁定事件的操作,而且它們也更加簡短。代碼如下:
$(elements).on( events [, selector] [, data] , handler );
$(elements).off( [ events ] [, selector] [, handler] );
其中on()替代了之前版本中的bind()、delegate()和live();off()替代了unbind()、undelegate()和die()。下面代碼是新舊API調用之間對應的例子:
$('a').bind('click', myHandler); //舊
$('a').on('click', myHandler); //新

$('form').bind('submit', { val: 42 }, fn); //舊
$('form').on('submit', { val: 42 }, fn); //新

$(window).unbind('scroll.myPlugin'); //舊
$(window).off('scroll.myPlugin'); //新

$('.comment').delegate('a.add', 'click', addNew); //舊
$('.comment').on('click', 'a.add', addNew); //新

$('.dialog').undelegate('a', 'click.myDlg'); //舊
$('.dialog').off('click.myDlg', 'a'); //新

$('a').live('click', fn); //舊

$(document).on('click', 'a', fn); //新
$('a').die('click'); //舊

$(document).off('click', 'a'); //新

  • 事件委托的性能改進

20140121085456546.png 
隨 著頁面大小和復雜度的不斷增長,事件委托變得越來越重要。比如Backbone, JavaScript MVC和Sproutcore等應用框架都使用了大量的事件委托??紤]到這一點,jQuery 1.7重構了事件委派,使其更加快速,尤其是在大多數常見情況下。圖10-1是1.6.4和1.7版本的性能比較,最終的事件委托和1.6.4相比,節省 了大約一半的時間:

  • 更好地支持IE 6/7/8下的HTML 5

任何試圖在IE 6/7/8中使用新的類似于<section>的HTML 5標簽,毫無疑問都會遇到IE 6/7/8無法解析這些標簽,甚至將這些標簽從文檔中移除的問題。在jQuery 1.7中,為較舊IE版本中html()一類的方法建立了對HTML 5的支持。這一功能和以前的innerShiv相同,但你仍然需要在你的文檔頭部加入HTML5Shiv(或者Modernizr)以使舊IE版本支持HTML 5標簽。如需要更多資料,請查看The Story of the HTML5 Shiv(http://paulirish.com/2011/the-history-of-the-html5-shiv/)。

  • 更直觀地切換動畫

在jQuery的舊版本中,類似于slideToggle()或fadeToggle()的切換動畫在互相堆放和前一個動畫被stop()終止時無法正常工作。在1.7版本中這一情況被修復,動畫系統會記住元素的初始值并在一個切換的動畫被提前終止時重置它們。

  • 異步模塊定義(AMD)

jQuery 1.7支持AMD規范,可以和遵循AMD規范的腳本加載器協作,比如RequireJS或者curl.js。

  • jQuery.Deferred

jQuery.Deferred對象除了提供新的進度處理及通知方法之外,同時也新增一個可用來取得目前Deferred狀態的state()方法。Deferred也通過jQuery.Callbacks機制來提供給開發者一個統一的事件處理接口。

  • jQuery.isNumeric()

在使用jQuery的過程中,有時候需要知道一個參數是數值或可以被成功的轉換為數值的情況。所以jQuery開發并公開jQuery.isNumeric()方法。為它傳遞一個任意類型的參數,它將對應的返回true或false。

  • 棄用和刪除的功能

jQuery將開始棄用過時的特性,以使代碼庫更加精簡,同時提高性能。比如live()和die()已在1.7版本中被棄用,這些方法還將繼續有效,但為了兼容以后的版本不建議使用它們,可以使用on()、off()和delegate()之類的代替。
一些非標準的特性在1.7版本中被徹底移除了,比如event.layerX和event.layerY,可以使用event.originalEvent.layerX和event.originalEvent.layerY代替。

jQuery.isNaN():這一未公開的實用函數已被刪除,新的jQuery.isNumeric()提供了類似的功能,并且可以被更好的支持。

jQuery.event.proxy():這一未公開和過時的方法已被刪除,開發者應使用公開的jQuery.proxy方法代替。
jQuery所有版本的發行說明可以在官方站點查到,網址為http://blog.jquery.com/和http://jquery. org/history/。


發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb
www.日韩视频| 久久亚洲私人国产精品va| 国产精品高潮呻吟久久av野狼| 中文字幕视频一区二区在线有码| 欧美一级淫片播放口| 69久久夜色精品国产7777| 日韩激情av在线免费观看| 国产精品亚洲аv天堂网| 精品高清美女精品国产区| 国产一区二区丝袜| 91av在线视频观看| 亚洲欧美日韩天堂一区二区| 日本不卡免费高清视频| 精品自在线视频| 日韩国产精品亚洲а∨天堂免| 亚洲视频在线观看| 2021国产精品视频| 亚洲伊人第一页| 色黄久久久久久| 欧美激情影音先锋| 亚洲国产日韩精品在线| 18一19gay欧美视频网站| 亚洲第一级黄色片| 亚洲精品国产精品国产自| 一色桃子一区二区| 亚洲第一色在线| 欧美老女人www| 精品久久久久久久久国产字幕| 亚洲毛茸茸少妇高潮呻吟| 91成人在线视频| 亚洲成人精品av| 亚洲欧美日韩中文视频| 久久精品久久久久久| 91精品国产自产在线观看永久| 亚洲精品98久久久久久中文字幕| 成人欧美一区二区三区黑人孕妇| 91在线视频九色| 日韩在线观看高清| 欧美xxxx18性欧美| 日韩av片免费在线观看| 国产精品99久久久久久www| 26uuu另类亚洲欧美日本一| 久久国产精品电影| 亚洲国产91色在线| 国产综合在线视频| 午夜精品久久久久久久久久久久久| 欧美一区亚洲一区| 国产一区二区日韩| 色综合亚洲精品激情狠狠| 国产成人精品午夜| 久久伊人91精品综合网站| 8x拔播拔播x8国产精品| 欧美激情一区二区久久久| 日韩动漫免费观看电视剧高清| 亚洲伊人第一页| 亚洲美女在线观看| 亚洲福利在线看| 色悠悠久久久久| 丝袜一区二区三区| 91精品视频网站| 欧美日韩激情视频8区| 日韩在线观看免费网站| 精品亚洲一区二区三区四区五区| 日韩免费观看在线观看| 国产在线精品自拍| 亚洲欧洲一区二区三区在线观看| 亚洲va码欧洲m码| 亚洲欧美日韩久久久久久| 亚洲午夜激情免费视频| 日韩av网站在线| 97欧美精品一区二区三区| 欧美成人午夜免费视在线看片| 日韩中文字幕在线精品| 久久久精品一区二区三区| 91麻豆国产语对白在线观看| 国产精品夫妻激情| 欧美在线一级va免费观看| 亚洲精品自在久久| 欧美精品午夜视频| 久久精品一本久久99精品| 亚洲成在人线av| 96国产粉嫩美女| 国产色视频一区| 欧美激情在线观看视频| 最近2019中文字幕一页二页| 成人亲热视频网站| 国产福利视频一区二区| 7m第一福利500精品视频| 亚洲视频电影图片偷拍一区| 亚洲色图校园春色| 秋霞成人午夜鲁丝一区二区三区| 日韩国产精品亚洲а∨天堂免| 欧美成人一区二区三区电影| 91久久精品美女高潮| 欧美综合国产精品久久丁香| 国产精品久久久久久久久久久久久久| 福利精品视频在线| 国产精品99久久久久久人| 亚洲精品91美女久久久久久久| 日本成人精品在线| 操日韩av在线电影| 国产成人一区二区三区| 精品久久久久久久久久久久久久| 亚洲人成网7777777国产| 欧美激情欧美激情在线五月| 538国产精品一区二区在线| 国产精品看片资源| 日韩免费观看视频| 日韩中文字幕免费看| 亚洲国产一区二区三区在线观看| 久久国产精品电影| 亚洲女同精品视频| 亚洲tv在线观看| 中文亚洲视频在线| 亚洲无av在线中文字幕| 精品久久在线播放| 国产免费亚洲高清| 亚洲在线视频福利| 欧美成人免费va影院高清| 奇米一区二区三区四区久久| 国产网站欧美日韩免费精品在线观看| 成人在线观看视频网站| 亚洲免费一级电影| 国产精品视频久久久久| 91超碰caoporn97人人| 亚洲影院色在线观看免费| 欧美国产日韩在线| 久久免费在线观看| 成人国产精品久久久久久亚洲| 久久成人人人人精品欧| 成人福利视频在线观看| 亚洲精品视频网上网址在线观看| 精品国产福利视频| 91福利视频网| 国产视频亚洲视频| 国产精品久久国产精品99gif| 精品成人乱色一区二区| 久久精品2019中文字幕| 色先锋资源久久综合5566| 亚洲精品之草原avav久久| 4388成人网| 久久久亚洲天堂| 日韩a**中文字幕| 国产精品一区二区女厕厕| 国产精品wwwwww| 国产精品一区二区三区成人| 欧美理论在线观看| 日韩国产高清视频在线| 伊人久久综合97精品| 精品久久久久久| 亚洲国产欧美一区二区三区同亚洲| 91久久精品国产91性色| 欧美亚洲激情视频| 91精品国产综合久久香蕉922| 精品女厕一区二区三区| 久久久亚洲影院你懂的| 亚洲欧美中文在线视频| 综合国产在线视频| 久久久久久久久久久免费精品| 亚洲成人网在线| 日韩免费在线电影| 欧美性videos高清精品| 成人精品视频99在线观看免费| 91欧美日韩一区|