(轉載自:http://www.ppblog.cn/jquery1-9live.html 版權歸原做者全部)
jQuery1.9中改變的地方
Jquery1.9中改變了不少東西,具體的升級能夠參考一下官方的升級指南。css
.toggle(function, function, … ) 方法刪除
這個方法綁定兩個或多個處理程序到匹配的元素,用來執行交替的點擊事件。它不該該被混同於顯示或隱藏匹配元素.toggle( )方法,由於它沒有過期。前者被刪除,以減小混亂和提升模塊化程度。jQuery Migrate(遷移)插件能夠恢復此功能。html
jQuery.browser() 方法刪除
jQuery.browser()方法從jQuery 1.3開始已通過時了,在1.9中被刪除。 若是須要的話,jQuery Migrate(遷移)插件能夠恢復此功能。咱們建議如特徵檢測,請使用Modernizr庫。jquery
.live() 方法移除
.live()方法從jQuery 1.7開始已通過時了,在1.9中被刪除。 咱們建議使用.on()方法來替換升級你的代碼。要徹底匹配$(「a.foo」).live(「click」, fn),例如,你能夠寫$(document).on(「click」, 「a.foo」, fn)(譯者注:由於原來的live事件實際上是綁定在文檔document上的)。有關詳細信息,請參閱.on()文檔。在此期間,你可使用jQuery Migrate(遷移)插件來恢復.live() 功能。git
.die() 方法移除
.die()方法從jQuery 1.7開始已通過時了,在1.9中被刪除。 咱們建議使用. off()方法來替換升級你的代碼。要徹底匹配$(「a.foo」).die(「click」),例如,你能夠寫$(document).off(「click」, 「a.foo」)。有關詳細信息,請參閱.off()文檔。在此期間,你可使用jQuery Migrate(遷移)插件來恢復. die() 功能。github
jQuery.sub() 方法移除
jQuery.sub()方法被移到jQuery Migrate(遷移)插件中。使用的頻率證實它沒有必要再保留在覈心代碼庫中,jQuery Migrate(遷移)插件添加了此功能。ajax
.add() 方法修改
.add()方法返回的結果老是按照節點在document(文檔)中的順序排列。在1.9以前,若是上下文或輸入的集合中任何一個以脫離文檔的節點(未在文檔中)開始,使用.add()方法節點不會按照document(文檔)中的順序排序。如今,返回的節點按照文檔中的順序排序,而且脫離文檔的節點被放置在集合的末尾。api
.addBack(selector) 替換 .andSelf()
從jQuery1.8開始,.andSelf()方法已經被標註過期,在jQuery1.8和更高版本中應使用.addBack()。數組
咱們認爲對於「添加並返回」之前的結果集合這是一個更好的名字。新方法能夠接受一個可選的選擇器,該選擇器能夠用來過濾以前集合,將它添加到當前集合並返回。$(「section, aside」).children(「ul」).addBack(「aside」) 會根據他們在文檔中的順序,獲得section與aside下全部ul子元素,外加全部aside元素。雖然.addSelf()在1.9中仍然可使用,咱們建議您儘快修更名稱。若是使用.addSelf(),jQuery Migrate插件會提出警告。promise
.after(), .before(), 和 .replaceWith()使用脫離文檔的節點
1.9之前,.after(), .before(), 和 .replaceWith()將嘗試在當前的jQuery集合中添加或改變節點,若是在當前的jQuery集的節點未鏈接到文檔(注:即脫離文檔的節點),在這種狀況下,返回一個新的jQuery集合,而不是原來的那個集合。這將產生一些先後矛盾和完全的錯誤 – 該方法可能會,也可能不會返回一個新的結果,這取決於它的參數!從1.9開始,這些方法老是返回原始未修改集而且試圖在一個沒有父節點的節點上使用.after(), .before(), or .replaceWith() 有沒有任何效果 – 即這個集或它包含的節點二者都不被改變。瀏覽器
.appendTo, .insertBefore, .insertAfter, 和 .replaceAll
在1.9中,這些方法老是返回一個新的集合,使他們可使用的鏈式調用和.end()方法。1.9以前,只有當他們是一個單獨的目標元素時,他們將返回舊的集合。須要注意的是這些方法老是返回全部元素附加到目標元素的聚合集合。若是沒有元素被目標選擇器選中(例如,$(elements).appendTo(「#not_found」))那麼返回的集合是空的。
AJAX 事件須要綁定到document
在jQuery 1.9中, 全局的AJAX事件(ajaxStart, ajaxStop, ajaxSend, ajaxComplete, ajaxError, and ajaxSuccess) 只能在document元素上觸發。修改AJAX事件監聽程序到document元素上。例如,若是目前的代碼看起來像這樣:
1
|
$(「#status」).ajaxStart(function(){ $(this).text(「Ajax started」); });
|
修改爲:
1
|
$(document).ajaxStart(function(){ $(「#status」).text(「Ajax started」); });
|
.trigger() 「click」 事件時Checkbox/radio 的狀態
當用戶點擊一個複選框或單選按鈕時,若是節點上沒調用event.preventDefault(),事件處理程序中會根據複選框或單選按的當前狀態判斷而且獲得它的新狀態。所以,例如,若是用戶點擊一個未選中的checkbox,事件處理程序將選中(checked)這個checkbox。1.9以前,.trigger(「click」) 或 .click()任何一個將觸發一個合成事件,根據用戶點擊行爲,咱們能夠看到checkbox與實際checked屬性相反的狀態。在1.9中修復了這個bug,用戶行爲會獲得相應的狀態。
focus事件觸發順序
當用戶再表單元素上點擊或者按tab鍵,使元素獲取焦點,瀏覽器首先在焦點元素上觸發一個blur(失去焦點)事件,而後在新元素上觸發一個focus(獲取焦點)事件。在1.9以前,使用.trigger(「focus」) 或 .focus() 綁定一個focus事件,新元素將觸發一個focus事件,而後觸發先前焦點元素的blur事件,1.9已修正此問題。
若是目標元素沒有獲取焦點而且能夠成功的獲取焦點(譯者注:好比disabled被禁用的表單元素獲取不到焦點),那麼使用DOM原生的focus事件,瀏覽器只訪問focus事件處理程序。jQuery老是調用.trigger(「focus」) 或 .focus()綁定的處理程序,不管元素是否獲取焦點。在jQuery 1.9中仍是這樣處理的。和DOM的.focus()方法不一樣之處在於,在許多狀況下,元素已經獲取焦點或者元素被禁用,DOM的.focus()方法不會調用事件處理程序。
不幸的是,全部版本的Internet Explorer(6-10)觸發焦點事件是異步的。當你在IE中使用.trigger(「focus」),jQuery沒法「預知」異步focus事件之後會發生什麼。因此它老是會觸發一個本身的focus事件,以確保功能正常。這可能會形成focus事件重覆執行,建議改用DOM內建的focus()較單純,例如: $(「#boo」).get(0).focus()。
jQuery(htmlString)與jQuery(selectorString)
在1.9之前,若是一個字符串中有任何HTML標籤,那麼這個字符串將被認爲是一個HTML字符串。這有可能形成意外的代碼執行和拒絕有效的選擇器字符串。 1.9開始,以一個小於號(「<」)字符開頭的字符串才被認爲是HTML字符串。Migrate(延遲)插件能夠恢復到1.9之前的行爲。
若是一個字符串被認爲是HTML,但可能會以不是一個HTML標籤的任意文本開始,將它傳遞給jQuery.parseHTML()將返回一個DOM節點數組表示的標記。咱們能夠經過它來建立一個jQuery集合,例如:$($.parseHTML(htmlString))。例如,在處理HTML模板方面這被認爲是最佳實踐。簡單使用文字字符串,如$(「<p>Testing</p>」).appendTo(「body」)不會受此影響。
總之:HTML字符串傳遞給jQuery(),除了以一個小於號(「<」)字符開始之外的其餘字符串都將被解釋爲一個選擇器。由於字符串一般不能被解釋爲一個選擇器,最有可能的結果是Sizzle選擇器引擎錯誤拋出的「無效的選擇器語法」。使用jQuery.parseHTML()來解析任意的HTML。
使用jQuery Migrate(遷移)插件,若是該字符串傳遞給$(),「看起來像HTML」,它會使用舊的規則來肯定。
.data()中名稱包含點(「.」)改變
.data()有一個未公開而且使人難以置信的非高性能監控值的設置和獲取,1.9中被移除。這已經影響到了包含點的數據名稱的解析。從1.9開始,調用 .data(「abc.def」)只能經過名稱爲「abc.def」檢索數據,本來還能夠經過「abc」取得的技巧已被取消。須要注意的是較低級別的jQuery.data()方法不支持事件,因此它並無改變。即便使用jQuery Migrate(遷移)插件也恢復不到原來的行爲。
脫離文檔節點在jQuery集合中的順序
對於許多版本,幾乎全部的jQuery的方法,返回一組新的節點集合,這個集合是一個使用他們在文檔中順序排序的結果集。(有幾個方法,如.parents()返回的結果是他們在文檔反向順序排序,但在1.9中這些例外狀況已經記錄並無改變。)
在1.9以前,若jQuery集合中混雜DOM的節點及未放進DOM的脫離文檔節點,則可能出現不可預期的隨機排序。從1.9開始,在文檔中的鏈接節點都老是按文檔順序放置在集合的開頭,脫離文檔節點被放置在他們的後面。即便使用jQuery Migrate(遷移)插件也恢復不到原來的行爲。
加載而且執行HTML內容中的scripts
在1.9以前,任何接受HTML字符串的方法(例如,$()、.append()、.wrap())會執行HTML字符串中所包含的Script,而且將它們從文檔中移除,以防止他們再次被執行。在特殊狀況下,使用這些方法一個腳本可能會被移除並從新插入到文檔中,好比.wrap()。從1.9開始,插入到文檔的腳本會執行,但仍然保留在文檔中而且標記爲已經被執行過的,這樣它們就不會被再次執行,即便它們被刪除並從新插入。
儘管這種變化,在HTML標記中混合可執行的JavaScript是很是很差的習慣;它對設計,安全性,可靠性和性能有影響。例如,外部腳本標籤包含在HTML中同步地取出,而後評估執行,這可能須要大量的時間。沒有任何接口通知這些腳本什麼時候何地加載,或者當有錯誤產生的時候得到糾正提示。
試圖經過克隆一個現有的腳本標籤加載和注入腳本,克隆到文檔將再也不起做用,由於克隆的腳本標記已經被標記爲已執行。要加載一個新的腳本,建議使用jQuery.getScript()代替。
.attr() 和 .prop()對比
jQuery 1.6 介紹了.prop()方法設置或獲取節點上的對象屬性(property),而且不建議使用.attr()方法設置對象屬性(property)。然而版本一直到1.9,在某些特殊狀況下繼續支持使用.attr()方法。當選擇器是用來區分標籤屬性(attributes)和對象屬性(properties)時,這種行爲在向後兼容的命名方面會引發混亂。
例如,一個複選框的布爾標籤屬性(attributes),如checked和disabled受到這種變化的影響。」input[checked]「的正確行爲是選擇有checked屬性的複選框,不論是它的字符串值,仍是它當前的狀態。與此相反, 「input:checked」 選擇當前checked屬性的布爾值(true或false)爲true的複選框,例如當用戶單擊複選框時,會受到影響。1.9以前版本這些選擇器有時不選擇正確的節點。
這裏有一些例子,當在複選框上設置一個checked屬性時正確的和不正確的使用方法;一樣的規則也適用於disabled屬性。請注意只有對象屬性(property)在全部的瀏覽器始終反映和更新的複選框的當前狀態;你不多會須要設置的屬性(attribute)。
1
2
3
4
5
6
7
8
|
// Correct if changing the attribute is desired
$(elem).attr(
"checked"
,
"checked"
);
// Correct for checking the checkbox
$(elem).prop(
"checked"
,
true
);
// Correct if removing the attribute is desired
$(elem).removeAttr(
"checked"
);
// Correct for clearing the checkbox
$(elem).prop(
"checked"
,
false
);
|
老IE中的$(「input」).attr(「type」, newValue)
在1.9版以前, 在全部的瀏覽器中,任何企圖設置一個input或者button元素的類型(type屬性),jQuery都將拋出一個異常。這樣作時爲了符合最低標準的兼容;由於若是你試圖改變input元素的類型,IE6/7/8拋出一個錯誤。從 jQuery 1.9開始,若是瀏覽器容許的話,咱們容許您設置元素的類型。可是,你須要知道本身的代碼,在老IE(IE6/7/8)下試圖作到這一點仍是會拋出一個錯誤。當你試圖設置類型屬性時,jQuery Migrate(遷移)插件會發出警告,但不會拋出一個JavaScript錯誤。
那麼何時使用attr何時使用prop:
1.添加屬性名稱該屬性就會生效應該使用prop();
2.是有true,false兩個屬性使用prop();
3.其餘則使用attr();
如下是官方建議attr(),prop()的使用:
Attribute/Property | .attr() | .prop() |
---|---|---|
accesskey | √ | |
align | √ | |
async | √ | √ |
autofocus | √ | √ |
checked | √ | √ |
class | √ | |
contenteditable | √ | |
draggable | √ | |
href | √ | |
id | √ | |
label | √ | |
location ( i.e. window.location ) | √ | √ |
multiple | √ | √ |
readOnly | √ | √ |
rel | √ | |
selected | √ | √ |
src | √ | |
tabindex | √ | |
title | √ | |
type | √ | |
width ( if needed over .width() ) | √ |
「hover」僞事件
從1.9開始,事件名稱字符串「hover」再也不支持爲「mouseenter mouseleave」的代名詞縮寫。容許應用程序綁定和觸發自定義的」hover」事件。修改現有的代碼是一個簡單的查找/替換,而且jQuery Migrate(延遲)插件能夠恢復」hover」僞事件。
jQuery對象上的.selector屬性
jQuery對象上過期的selector屬性保留的目的是爲了支持過期的.live()事件。在1.9中,jQuery再也不試圖在鏈方法上保留這個屬性,由於1.9已經移除了.live()事件。不要使用jQuery對象的.selector屬性。jQuery Migrate(遷移)插件也沒支持這個屬性。
jQuery.attr()
1.9版移除了jQuery.attr(elem, name, value, pass)方法,用jQuery Migrate(遷移)插件可恢復這個方法。
jQuery.ajax返回一個空字符串的JSON結果
1.9以前,一個AJAX調用預期返回JSON或JSONP的數據類型,當返回值是一個空字符串時會被認爲是成功的狀態,但返回一個null給success處理程序或承諾(promise)。從1.9開始,JSON數據返回一個空字符串被認爲是畸形的JSON(由於它原本就是);這將拋出一個錯誤。這種狀況下,使用error(錯誤)處理程序捕獲。
jQuery.proxy()
1.9版前,$.proxy(null, fn)、$.proxy(undefined, fn)的this會指向window,而$.proxy(false, fn)的this則指向new Boolean(false) ;1.9起若context傳入null/undefined/false,函數的this會維持原先context,不被改變。
.data(「events」)
1.9之前,若是沒有其餘的代碼定義一個名稱爲「events」的數據元素,.data(「events」) 能夠用來檢索一個元素上,jQuery未公開的內部事件數據結構。這種特殊的狀況,在1.9中已被刪除。沒有公共的接口來獲取這個內部數據結構,
它是不公開的。jQuery Migrate(遷移)插件能夠恢復原來的行爲。
移除Event對象的部分屬性
Event對象的attrChange、attrName、realtedNote和srcElement屬性自1.7版因沒法跨瀏覽器已被宣告過期;從jQuery 1.9開始,它們再也不被複制到Event對象傳遞給事件處理程序。在jQuery全部版本中,這些屬性依然能夠在支持他們的瀏覽器上經過event.orginalEvent存取,以取代event。jQuery Migrate(遷移)插件在Event對象有加回了這些屬性。
API方法未公開的參數
1.9以前,幾個API方法未公開改變了他們的行爲的參數,並存在潛在的意外誤用。這些參數已經被刪除。受影響的方法包括jQuery.data(),jQuery.removeData(),和jQuery.attr()。jQuery Migrate(遷移)插件也不支持的代碼。
其餘未公開的屬性和方法
下面的內部屬性和方法從未被收入到文檔,並已在1.9中刪除。
-
jQuery.deletedIds
-
jQuery.uuid
-
jQuery.attrFn
-
jQuery.clean()
-
jQuery.event.handle()
-
jQuery.offset.bodyOffset()
遷移插件
現有的網站和插件可能會受到這些變化的影響,因此提供一個過渡性的升級路徑—— jQuery Migrate(遷移)插件。(或:
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>
)下面的說明中,在1.9中變化或刪除的API,大部分可使用jQuery Migrate(遷移)插件恢復。請注意,jQuery 1.9中全部的變化也將應用到jQuery 2.0中,jQuery Migrate(遷移)插件在jQuery2.0中也是可用的。
未壓縮,開發版本的jQuery Migrate(遷移)插件使用時會在控制檯中顯示警告信息,詳細的指出不兼容或刪除等信息及解決方法。這使得它在現有的jQuery代碼和插件上查找和修復問題時很是有用。jQuery Migrate(遷移)插件包含了1.6.4以來存在但1.9已不支持全部API。
壓縮版本的的jQuery Migrate(遷移)插件,不會在瀏覽器控制檯中產生任何不兼容或刪除等信息,而且能夠在jQuery 1.9或更高版本,或者舊的不兼容的jQuery代碼或插件中使用。
理想狀況下,這將只能做爲一個短時間的解決方案,可是這要你本身作出決定。