1. 程式人生 > >jQuery事件處理,節點

jQuery事件處理,節點

事件處理:

1、頁面載入後的執行

  類似於window.onload 但不同於 window.onload

  jQuery載入後執行的特點:

  在DOM樹載入完畢的時候就開始執行

    $(document).ready( function(){

    //頁面的初始化操作

    //DOM樹載入完成後就開始執行

    } );

 

    $().ready( function(){

    //頁面的初始化操作

    //DOM樹載入完成後就開始執行

    } );

 

    $( function(){

    //頁面的初始化操作

    //DOM樹載入完成後就開始執行

    } );

 

2、jQuery的事件繫結

方式1

$obj.bind("事件名稱",事件處理函式);

ex:

  $obj.bind("click",function(){

  //事件的行為操作

  console.log("... ....");

  });

 

方式2

  $obj.事件名稱(function(){

  //事件處理函式
  });

  ex:
    $obj.click(function(){
    //通過 this 來表示觸發該事件的DOM物件
    });


3、事件物件 - event


在繫結事件的時候,允許傳遞 event 引數來表示事件物件

  $obj.bind("click",function(event){
  //event表示當前事件的事件物件
  });

  $obj.click(function(event){
  //event表示當前事件的事件物件
  });

  event的使用方式與原生JS事件中的event使用方式一致。
  event.stopPropagation() : 阻止事件冒泡
  event.offsetX:
  event.offsetY:
  event.target:獲取事件源

 

 

節點:

1、children() / children("selector")

  獲取某jQuery物件的所有子元素 或 帶有指定選擇器的子元素

  注意:只考慮子代元素,不考慮後代元素

2、next() / next("selector")

  獲取某jQuery物件的下一個兄弟元素 / 滿足selector的下一個兄弟元素

3、prev() / prev("selector") 

  獲取某jQuery物件的上一個兄弟元素 / 滿足selector的上一個兄弟元素

4、siblings() / siblings(selector)

  獲取某jQuery物件的所有兄弟元素 / 滿足selector的所有兄弟元素

5、find("selector")

  查詢滿足selector選擇器的所有後代元素

6、parent()

  查詢某jQuery物件的父元素