JAVASCRIPT網頁應用程式設計

258

|

附錄 A

如果想讓元件的不透明度緩慢的變化，可以這麼寫：

$(".foo").fadeOut();

$(".foo").fadeIn();

jQuery 並不是只有提供 CSS 樣式的取值函式和設值函式。也可以利用

html()

函式來讀

取 / 設定網頁元件的內容：

// 找出符合選取項查詢條件的第一組網頁元件，讀取它的 HTML 程式碼

var getHTML = $("#bar").html();

// 找出符合選取項查詢條件的所有網頁元件，設定它們的 HTML 程式碼

$("#bar").html("<p>Hi</p>");

text()

函式的功能也大致相同，只不過傳入的參數都會被編碼為純文字內容：

var getText = $("#bar").text();

$("#bar").text(" 這是純文字的內容 ");

最後，如果想要移除某個元件的所有子元件，可以用

empty()

函式：

$("#bar").empty();

事件

瀏覽器對於事件的處理，有一段不堪回首的過往，造就我們如今所見，各家瀏覽器互不

相容的 API。不過還好，jQuery 已經默默的幫我們處理掉這些棘手的跨瀏覽器相容性

問題，如今我們只需面對 jQuery 所提供的 API。這裡介紹的 jQuery 事件處理做法，只

是簡短的概要，欲知更多詳情，可參閱本書第二章，或 jQuery 的官方文件（

http://api.

jquery.com/category/events

）。

如果要新增事件處理器，可以呼叫

bind()

函式，並傳入兩組參數 ...