1. 程式人生 > >總結篇-jQuery框架相關(未完待續...)

總結篇-jQuery框架相關(未完待續...)

1.jquery不常用但實用的方法

(1)位置相關
    offset()          $(“#qq”).offset()          相對瀏覽器視窗的位置
    offsetParent()    $(“#qq”).offsetParent()    #qq相對最近的已經定位的祖先的位置
    position()        $(“#qq”).position()        已定位的元素的position值
(2)DOM元素的包裹
    wrap()           $(“#qq”).wrap(“<div id=’qqPar’/>”) 
    wrapAll()        所有指定元素都會被包裹
    wrapInner()      指定元素的內容會被包裹
(3)刪除相關
    detach()         刪除了還能恢復
    empty()          刪除子元素的所有東西
    remove()         刪除指定元素
    unwrap()         刪除指定元素的父節點,但是保留本身

2.如何用jQuery禁用瀏覽器的前進後退按鈕

$(document).ready(function() {
    window.history.forward(1);
    window.history.forward(-1);
});

3.jQuery的事件委託方法bind 、live、delegate、on之間有什麼區別

1.bind(適用於靜態元素事件)
用法:主要用於給選擇到的元素上繫結特定事件型別的監聽函式。
舉例:$("#ulPre").bind("click",function(e){});
特點:
  1.適用於頁面元素靜態繫結,不能給未來新增的元素繫結事件。
    2.當頁面載入完的時候,你才可以進行bind(),所以可能產生效率問題。

2.live(一般不用)
用法:主要用於給選擇到的元素上繫結特定事件型別的監聽函式;
特點:
  1.live方法並沒有將監聽器繫結到自己(this)身上,而是繫結到了this.context上了。
    2.live正是利用了事件委託機制來完成事件的監聽處理。
    3.使用live()方法但卻只能放在直接選擇的元素後面,不能在層級比較深。

3.delegate
用法:將監聽事件繫結在就近的父級元素上
例項:$("table").delegate("td","click",function(){});
特點:
    1.選擇就近的父級元素,因為事件可以更快的冒泡上去,能夠在第一時間進行處理。
    2.更精確的小範圍使用事件代理,效能優於.live()。可以用在動態新增的元素上。

4.on(整合以上三種,最受推薦的事件監聽方法,引數的位置寫法與delegate不一樣)
用法:將監聽事件繫結到指定元素上。
例項:$("#info_table").on("click","td",function(){});
特點:
    1.動態新增元素的事件委託。
    2.最為常用的,且其書寫方式滿足事件繫結的寫法規範。