1. 程式人生 > >JQuery 備忘

JQuery 備忘

checked can 獲取值 ont tor undefined blog 及其 節點

一、.on() .bind() .delegate() .live()的區別

  jquery 1.7之後建議綁定事件用 .on( ),移除事件處理函數用 .off( )

$(selector).bind(event,data,function); 
$(selector).live(event,data,function); //jquery1.9版本以下支持,jquery1.9及其以上版本刪除了此方法
$(selector).delegate(childSelector,event,data,function)//jquery1.4.2及其以上版本;1.7版本之後被 .on()替代 $(selector).on(event,childselector,data,function
); //jquery1.7及其以上版本;jquery1.7版本出現之後用於替代上述三種綁定事件方式;

(1) .bind( )

  .bind( )是直接綁定在元素上,而且當使用 bind 時,該元素必須是已經存在的。

  如果不人為的設置stopPropagation(Moder Browser), cancelBubble(IE),那麽它的所有父元素,祖宗元素都會受之影響;

(2) .live( )——1.7版本已刪除

  將委托的事件處理程序附加到一個頁面的 document 元素而不是像 .bind( ) 給所有的元素挨個綁定;

  那些動態添加的元素依然可以觸發那些早先綁定的事件,因為事件真正的綁定是在document上;

   舊版本的jQuery中用戶,應優先使用 .delegate( )來取代 .live( )。

(3) .delegate( )

  當使用 delegate 時,該元素可以是未來才存在的。

  delegate是將事件註冊到已經存在的document,當發生click事件時,只需要匹配#objId是否跟觸發的對象一致,一致即執行函數。

(4) .on( )

  .on( )是最新的1.9版本整合了之前的三種方式的新事件綁定機制。

二、.attr( ) 和 .prop( )的區別

  對於一些屬性,有的瀏覽器只要寫disabled,checked就可以了,而有的要寫成disabled = "disabled",checked="checked",比如用attr("checked")獲取checkbox的checked屬性時選中的時候可以取到值"checked",但沒選中獲取值就是undefined。

  jq提供新的方法“prop”來獲取這些屬性,就是來解決這個問題的,使用prop方法獲取checked屬性則統一返回true和false。

  那麽,什麽時候使用attr(),什麽時候使用prop()?
    1.添加屬性名稱該屬性就會生效應該使用prop();
    2.是有true,false兩個屬性使用prop();
    3.其他則使用attr();

  官方建議attr(),prop()的使用:

技術分享

三、.remove( ) .detach( ) .empty( )的區別

(1) .remove( )

  用remove()刪除節點後,此節點以及所有後代節點同時刪除。該方法返回值是一個指向已被刪除的節點。

  除了這個元素本身得以保留之外,其他的比如綁定的事件,附加的數據等都會被移除。

(2) .detach( )

  與remove()的區別是仍然保留其綁定的數據。

(3) .empty( )

  清空元素內的所有後代元素。

JQuery 備忘