What is “this”? 在物件導向程式設計中,類別的定義就是在說明如果創建了“這個物件”的話,它會具有那些屬性與功能,以及這些功能是如何實現的。 而所謂的“這個物件”就以 this 來表示。 當我們在JavaScript與jQuery中寫 script 程式(函式)時,“誰”呼叫這個函式,這個“誰”就是該函式中所謂的 this。
jQuery ready $(document).ready( // 裡面撰寫你想執行的 script 程式碼。 ); // 想像成花錢($)為 DOM 添加裝備來變成 jQuery $(DOM-object) => jQuery jQuery[index] => DOM-object
Getting objects by DOM and jQuery DOM: document.getElementById(“id”) jQuery: $(“#id”) <-- 注意 id 前有 # DOM: document.getElementsByTagName(“tag”) jQuery: $(“tag”) DOM: document.getElementsByClassName(“cla”) jQuery: $(“.cla”) <-- 注意 className cla 前有 .
jQuery is chainable jquery = $(“p”).css(…) ; <-- 傳回 jQuery 物件。 jquery = jquery.html(…); <-- 傳回 jQuery 物件。 jquery = jquery.fadeIn(…); <-- 傳回 jQuery 物件。 可等效地以串接的方式來寫這一系列的呼叫: $(“p”).css(…) <-- 傳回 jQuery 物件。 .html(…) <-- 傳回 jQuery 物件。 .fadeIn(…) <-- 傳回 jQuery 物件。 => $(“p”).css(…).html(…).fadeIn(…);
jQuery hover $(document).ready( function() { $('img').hover( function() { // over 事件 $('img').animate( {'margin-left': '+=30px'}, 500); } , function() { // leave 事件 $('img').animate( {'width': '-=10px', 'height': '-=10px'}, 500); });